Skip to content

polysoft-nafmii / polysoft-h5

Go to a project
Commit f9754122 by fanx
Options

原生和js交互方法封装

1 parent 81dee50e
Inline Side-by-side
Showing 10 changed files with 172 additions and 5 deletions
package.json
...@@ -15,6 +15,7 @@ ...@@ -15,6 +15,7 @@
"autoprefixer": "^9.7.6", "autoprefixer": "^9.7.6",
"axios": "^0.21.1", "axios": "^0.21.1",
"core-js": "^3.6.5", "core-js": "^3.6.5",
"cropperjs": "^1.5.11",
"js-cookie": "^2.2.1", "js-cookie": "^2.2.1",
"lib-flexible": "^0.3.2", "lib-flexible": "^0.3.2",
"vant": "2.5.7", "vant": "2.5.7",
......
src/main.js
...@@ -5,6 +5,7 @@ import App from './App.vue' ...@@ -5,6 +5,7 @@ import App from './App.vue'
import router from './router' import router from './router'
import store from './store' import store from './store'
import Axios from '@/utils/Axios' import Axios from '@/utils/Axios'
import '@/utils/Interface'
import '@/utils/vant-ui.js' import '@/utils/vant-ui.js'
import i18n from '@/i18n' import i18n from '@/i18n'
import '@/assets/css/index.less' import '@/assets/css/index.less'
......
src/router/modules/user.js
...@@ -115,6 +115,22 @@ const userRouter = [ ...@@ -115,6 +115,22 @@ const userRouter = [
}, },
component: () => import(/* webpackChunkName: "service" */ '@/views/user/service.vue') // 服务协议 component: () => import(/* webpackChunkName: "service" */ '@/views/user/service.vue') // 服务协议
}, },
{
path: '/user/person',
name: 'Person',
meta: {
title: '个人信息'
},
component: () => import(/* webpackChunkName: "person" */ '@/views/user/person/index.vue') // 个人信息
},
{
path: '/user/commonEdit',
name: 'CommonEdit',
meta: {
title: ''
},
component: () => import(/* webpackChunkName: "commonEdit" */ '@/views/user/person/commonEdit.vue') // 个人信息
},
] ]
export default userRouter export default userRouter
\ No newline at end of file \ No newline at end of file
src/utils/Interface.js 0 → 100644
const NativeInterface = {
}
const JsInterface = {
}
class Interface {
constructor() {
this.listeners = {}
this.init()
}
on(methodName, callback) {
this.listeners[methodName] = callback
}
init() {
NativeInterface.forEach(methodName => {
this[methodName] = (data, jsMethodName, callback) => {
try {
if (jsMethodName) {
this.listeners[jsMethodName] = callback
}
const json = JSON.stringify(jsMethodName && { jsMethodName, data } || { data })
window.$NativeApi[methodName](json)
} catch (e) {
callback && callback()
console.log('-----无效，非内置调用', methodName)
}
}
})
JsInterface.forEach(methodName => {
this[methodName] = (data) => {
const objValue = data ? JSON.parse(data) : data
this.listeners[methodName](objValue)
}
})
}
CallNativeFun(type, data) {
try {
const json = JSON.stringify(data)
window.$NativeApi[type](json)
} catch (e) {
console.log('-----无效，非内置调用', type)
}
}
}
window.$api = new Interface()
\ No newline at end of file \ No newline at end of file
src/views/user/center.vue
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<div class="user_center"> <div class="user_center">
<div class="header"> <div class="header">
<div class="header_left"></div> <div class="header_left"></div>
<div class="header_right"> <div class="header_right" @click="jumpPersonPage">
<div class="right_txt"> <div class="right_txt">
<div class="nick">凝视你的目光</div> <div class="nick">凝视你的目光</div>
<div class="phone">183****8924</div> <div class="phone">183****8924</div>
...@@ -77,6 +77,12 @@ export default { ...@@ -77,6 +77,12 @@ export default {
// 跳转到我到学习页面 // 跳转到我到学习页面
jumpStudyPage() { jumpStudyPage() {
},
// 跳转到 个人设置中心
jumpPersonPage(){
this.$router.push({
path:'/user/person'
})
} }
}, },
computed: { computed: {
......
src/views/user/person/commonEdit.vue 0 → 100644
<template>
<div class="common_container">
<NafmHeader :title="title" />
<input type="search" class="input">
</div>
</template>
<script>
export default {
name: 'CommonEdit',
data() {
return {
title: ''
}
},
mounted(){
this.title = 'hello'
console.log(this.$route.query.type)
console.log(this.$route.query.value)
}
}
</script>
\ No newline at end of file \ No newline at end of file
src/views/user/person/index.vue 0 → 100644
<template>
<div class="person_cantainer">
<NafmHeader />
<div class="setting_list">
<van-cell title="头像" center is-link value-class="right_content">
<template #default>
<img src="https://himg.bdimg.com/sys/portraitn/item/a0abbaacd0a6d2bbb9fd73756e6e798e8d" class="headerImg" alt="">
</template>
</van-cell>
<van-cell title="用户名" center is-link @click="handleEdit('用户名',)" value-class="right_content">
<template #default>
<span v-if="userName">{{userName}}</span>
<span v-else>请输入您的用户名</span>
</template>
</van-cell>
<van-cell title="手机号" center value-class="right_content">
<template #default>
183****8924
</template>
</van-cell>
<van-cell title="姓名" center is-link @click="jumpResetPage" value-class="right_content">
<template #default>
<span v-if="name">{{name}}</span>
<span v-else>请输入您的姓名</span>
</template>
</van-cell>
<van-cell title="国籍" center value-class="right_content">
<template #default>
中国
</template>
</van-cell>
<van-cell title="面容ID解锁" center value-class="right_content">
<template #default>
<van-switch v-model="faceIdChecked" @click="changeFaceIdStatus" size="20px" />
</template>
</van-cell>
</div>
</div>
</template>
<script>
export default {
name: 'Person',
data() {
return {
userName: '',
name:''
}
}
}
</script>
<style lang="less" scoped>
.headerImg {
width: 55px;
height: 55px;
border-radius: 50%;
}
.right_content {
display: flex;
align-items: center;
justify-content: flex-end;
}
</style>
\ No newline at end of file \ No newline at end of file
src/views/user/setting/index.vue
...@@ -109,11 +109,11 @@ export default { ...@@ -109,11 +109,11 @@ export default {
}, },
// 跳转到服务协议页面 // 跳转到服务协议页面
jumpServicePage() { jumpServicePage() {
this.$router.push({ // this.$router.push({
path: '/user/service' // path: '/user/service'
}) // })
this.$router.replace('/user/service')
}, },
} }
} }
</script> </script>
......
vue.config.js
...@@ -52,6 +52,7 @@ module.exports = { ...@@ -52,6 +52,7 @@ module.exports = {
port: "8080", port: "8080",
https: false, https: false,
hotOnly: false, hotOnly: false,
open: true,
overlay: { overlay: {
warning: false, warning: false,
errors: false errors: false
......
yarn.lock
...@@ -2864,6 +2864,11 @@ create-hmac@^1.1.0, create-hmac@^1.1.4, create-hmac@^1.1.7: ...@@ -2864,6 +2864,11 @@ create-hmac@^1.1.0, create-hmac@^1.1.4, create-hmac@^1.1.7:
safe-buffer "^5.0.1" safe-buffer "^5.0.1"
sha.js "^2.4.8" sha.js "^2.4.8"
cropperjs@^1.5.11:
version "1.5.11"
resolved "https://registry.yarnpkg.com/cropperjs/-/cropperjs-1.5.11.tgz#502ae6d8ca098b124de6813601cca70015879fc0"
integrity sha512-SJUeBBhtNBnnn+UrLKluhFRIXLJn7XFPv8QN1j49X5t+BIMwkgvDev541f96bmu8Xe0TgCx3gON22KmY/VddaA==
cross-spawn@^5.0.1: cross-spawn@^5.0.1:
version "5.1.0" version "5.1.0"
resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-5.1.0.tgz#e8bd0efee58fcff6f8f94510a0a554bbfa235449" resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-5.1.0.tgz#e8bd0efee58fcff6f8f94510a0a554bbfa235449"
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!