chen
/
public-opinion
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

优化实名通道与匿名通道选择

master
吃肉的饺子 2022-07-30 17:33:51 +08:00
parent a99ec3d4cf
commit 3fbe537a8d
10 changed files with 19 additions and 300 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
App.vue
View File

@ -25,7 +25,7 @@
/*每个页面公共css */
/* 阿里巴巴矢量图标库 start */
@import url("./commons/icon-font.css");
@import url("./commons/icon/icon-font.css");
/* 阿里巴巴矢量图标库 end */
/* 项目基础样式 start */
@import url("./commons/base.css");
@ -34,9 +34,5 @@
@import url("./commons/style.css");
/* 项目页面样式 end */
/* 动画样式 start */
@import url("./commons/animate.min.css");
/* 动画样式 end */
page {background-color: #FFFFFF;}
</style>

6
commons/icon-font.css → commons/icon/icon-font.css
View File

@ -1,8 +1,8 @@
@font-face {
font-family: "iconfont"; /* Project id 3180711 */
src: url('@/commons/iconfont.woff2') format('woff2'),
url('@/commons/iconfont.woff') format('woff'),
url('@/commons/iconfont.ttf') format('truetype');
src: url('@/commons/icon/iconfont.woff2') format('woff2'),
url('@/commons/icon/iconfont.woff') format('woff'),
url('@/commons/icon/iconfont.ttf') format('truetype');
}
.icon {
font-family: "iconfont" !important;

0
commons/iconfont.ttf → commons/icon/iconfont.ttf
View File

0
commons/iconfont.woff → commons/icon/iconfont.woff
View File

0
commons/iconfont.woff2 → commons/icon/iconfont.woff2
View File

13
pagesA/opinion-submit/opinion-submit.vue
View File

@ -1,7 +1,7 @@
<template>
<view>
<view class="pad-zy20">
<view class="" v-if="ifAnonymous">
<view class="" v-if="!ifAnonymous">
<view class="disjbac bbot pad-sx20">
<view class="fon30 colb bold flexs">真实姓名</view>
<input class="fon30 col9 tright width100" type="text" maxlength="16" placeholder="请输入姓名">
@ -89,20 +89,25 @@
</template>
<script>
import { mapState } from 'vuex';
const recorderManager = uni.getRecorderManager();
const innerAudioContext = uni.createInnerAudioContext();
innerAudioContext.autoplay = true;
export default {
data() {
return {
ifAnonymous:false,//是否是匿名提交
imgArr:[],
vedioArr:[],
audioText:''
}
},
onLoad(op) {
this.ifAnonymous = op.flag;
onLoad() {
},
computed: {
...mapState({
ifAnonymous: state => state.moduleA.ifAnonymous
})
},
methods: {
// 提交事件

4
store/index.js
View File

@ -2,15 +2,13 @@
import Vue from 'vue'
import Vuex from 'vuex'
import moduleA from '@/store/modules/moduleA'
import moduleB from '@/store/modules/moduleB'
Vue.use(Vuex);//vue的插件机制
//Vuex.modules 模块选项
const store = new Vuex.Store({
modules: {
moduleA,
moduleB
moduleA
}
})
export default store

84
store/modules/moduleA.js
View File

@ -1,88 +1,14 @@
// 购物车模块
// 用户模块
export default {
state:{//存放状态
token:'token已生成',
userInfo:{},
count:0,
publicColor:'',
todos: [{
id: 1,
text: '我是内容一',
done: true
},
{
id: 2,
text: '我是内容二',
done: false
}
],
obj:{
a:'吃鸡腿',
b:'吃自助餐'
}
ifAnonymous:false//是否匿名通道
},
// Vuex中store数据改变的唯一方法就是mutations 不适合异步方法
mutations: {
add(state) {
state.count = 7;
// 设置是否是匿名通道
setAnonymous(state,str) {
state.ifAnonymous = str;
},
add2(state, payload) {
state.count = payload.amount;
},
// 单个属性处理方法
setToken(state,str) {
state.token = str;
},
// 对象处理方法
updateUserInfo(state, payload) {
// 变更状态
state.userInfo = payload.userInfo;
},
// 新增字段方法
newProp(state,payload) {
state.obj = { ...state.obj, c: payload.c };
}
},
// 可以执行任意的同步和异步操作
actions:{
addCountAction ({commit}) {
commit('add')
},
addCountAction2 (context , payload) {
context.commit('add2', payload)
},
// 异步方法
addCountAction3 (context , payload) {
setTimeout(function () {
context.commit('add2', payload)
}, 2000)
},
actionA ({ commit }) {
return new Promise((resolve, reject) => {
setTimeout(() => {
commit('someMutation')
resolve()
}, 1000)
})
},
actionB ({ dispatch, commit }) {
return dispatch('actionA').then(() => {
commit('someOtherMutation')
})
}
},
// Vuex 允许我们在 store 中定义“getter”（可以认为是 store 的计算属性），对 state 的加工，是派生出来的数据。 可以在多组件中共享 getter 函数，这样做还可以提高运行效率。
getters: {
doneTodos: state => {
return state.todos.filter(todo => todo.done)
},
doneTodosCount: (state, getters) => {
//state ：可以访问数据
//getters：访问其他函数，等同于 store.getters
return getters.doneTodos.length
},
getTodoById: (state) => (id) => {
return state.todos.find(todo => todo.id === id)
}
}
}

87
store/modules/moduleB.js
View File

@ -1,87 +0,0 @@
export default {
state:{//存放状态
token:'token已生成',
userInfo:{},
count:0,
publicColor:'',
todos: [{
id: 1,
text: '我是内容一',
done: true
},
{
id: 2,
text: '我是内容二',
done: false
}
],
obj:{
a:'吃鸡腿',
b:'吃自助餐'
}
},
// Vuex中store数据改变的唯一方法就是mutations 不适合异步方法
mutations: {
add(state) {
state.count = 7;
},
add2(state, payload) {
state.count = payload.amount;
},
// 单个属性处理方法
setToken(state,str) {
state.token = str;
},
// 对象处理方法
updateUserInfo(state, payload) {
// 变更状态
state.userInfo = payload.userInfo;
},
// 新增字段方法
newProp(state,payload) {
state.obj = { ...state.obj, c: payload.c };
}
},
// 可以执行任意的同步和异步操作
actions:{
addCountAction ({commit}) {
commit('add')
},
addCountAction2 (context , payload) {
context.commit('add2', payload)
},
// 异步方法
addCountAction3 (context , payload) {
setTimeout(function () {
context.commit('add2', payload)
}, 2000)
},
actionA ({ commit }) {
return new Promise((resolve, reject) => {
setTimeout(() => {
commit('someMutation')
resolve()
}, 1000)
})
},
actionB ({ dispatch, commit }) {
return dispatch('actionA').then(() => {
commit('someOtherMutation')
})
}
},
// Vuex 允许我们在 store 中定义“getter”（可以认为是 store 的计算属性），对 state 的加工，是派生出来的数据。 可以在多组件中共享 getter 函数，这样做还可以提高运行效率。
getters: {
// doneTodos: state => {
// return state.todos.filter(todo => todo.done)
// },
// doneTodosCount: (state, getters) => {
// //state ：可以访问数据
// //getters：访问其他函数，等同于 store.getters
// return getters.doneTodos.length
// },
// getTodoById: (state) => (id) => {
// return state.todos.find(todo => todo.id === id)
// }
}
}

119
store/readme.md
View File

@ -1,119 +0,0 @@
#引入vuex状态机
在根目录创建store目录
#在main.js引入store、注册store、挂载store在程序上
import Vue from 'vue';
import App from './App';
#import store from './store'
#Vue.prototype.$store = store
const app = new Vue({
# store,
...App
})
app.$mount()
#在页面内使用store的属性
<view @tap="add"></view>
import { mapState,mapGetters,mapMutations } from 'vuex'//引入mapState
export default {
data() {
return {}
},
#单纯访问属性值
computed:{
tokenEv() {
return this.$store.state.token;
}
},
<!--
需要引入 import { mapState } from 'vuex'//引入mapState
-->
computed:mapState({
// 从state中拿到数据 箭头函数可使代码更简练
token: state => state.token,
}),
computed:mapState(['token']),
computed: {
...mapState({
token: function (state) {
return '追加的' + state.token
},
userInfo: state => state.userInfo,
})
},
computed:{
...mapState([
'token',
'userInfo',
'count',
'obj'
])
},
computed: {
...mapState({
token: state => state.moduleA.token,
count: state => state.moduleB.count
}),
},
#单纯访问方法
computed: {
todos() {
return this.$store.getters.doneTodos
}
},
computed: {
doneTodosCount() {
return this.$store.getters.doneTodosCount
}
},
<!-- 方法传值 -->
computed: {
getTodoById() {
return this.$store.getters.getTodoById(1)
}
},
<!--
需要引入 import { mapGetters } from 'vuex'//引入mapState
-->
computed: {
// 使用对象展开运算符将 getter 混入 computed 对象中
...mapGetters([
'doneTodos',
'doneTodosCount',
'getTodoById'
// ...
])
},
onLoad(options) {
#改变状态机里面的值
<!-- 传递字符串改变 -->
this.$store.commit('setToken', 'token已改变');
<!-- 传递对象 -->
this.$store.commit('updateUserInfo',{userInfo:'用户信息'})
this.$store.commit({
type: 'updateUserInfo',
userInfo: '新方式更新用户信息'
})
this.$store.commit('newProp',{c:'吃火锅'})
<!-- 输出值 -->
console.log(this.token);
<!-- 调用方法 -->
this.add();
<!-- 必须是同步方法 -->
this.$store.dispatch('addCountAction')
this.$store.dispatch('addCountAction2',{amount:10})
<!-- 异步方法 -->
this.$store.dispatch('addCountAction3',{amount:30})
setTimeout(()=>{
console.log(this.count,388);
},3000)
},
methods: {
<!--
需要引入 import { mapMutations } from 'vuex'//引入mapState
-->
...mapMutations(['add']),//对象展开运算符直接拿到add
}
}