之前写过一个小程序的,引入单个下拉框是没有问题的,但是一个页面引入多个下拉框组件的话就会有bug,比如可以同时展开多个下拉框的问题,在此修复了。如果大家有什么好的办法可以告诉我一下嘛~
小程序选择框_WeiflR10的博客-CSDN博客_小程序选择框
子组件
暂无数据
{{item.name}}
父组件
类别
人员
属性
车辆
运输人员
地点
商户
store.js
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
const store = new Vuex.Store({
state: {
isjiantou0:true,
isjiantou1:true,
isjiantou2:true,
isjiantou3:true,
isjiantou4:true,
isjiantou5:true,
isjiantou6:true,
},
mutations: {
getjiantou0(state,n){
state.isjiantou0=n
},
getjiantou1(state,n){
state.isjiantou1=n
},
getjiantou2(state,n){
state.isjiantou2=n
},
getjiantou3(state,n){
state.isjiantou3=n
},
getjiantou4(state,n){
state.isjiantou4=n
},
getjiantou5(state,n){
state.isjiantou5=n
},
getjiantou6(state,n){
state.isjiantou6=n
}
},
actions: {
getjiantou0(context,args){
context.commit('getjiantou0',args);
},
getjiantou1(context,args){
context.commit('getjiantou1',args);
},
getjiantou2(context,args){
context.commit('getjiantou2',args);
},
getjiantou3(context,args){
context.commit('getjiantou3',args);
},
getjiantou4(context,args){
context.commit('getjiantou4',args);
},
getjiantou5(context,args){
context.commit('getjiantou5',args);
},
getjiantou6(context,args){
context.commit('getjiantou6',args);
},
}
})
export default store
注:模板字符串。
如果想在js中输出this.isjiantou0 this.isjiantou1 this.isjiantou2 ...,可以使用模板字符串
//`${'jiantou' + i}`
//this[`${'jiantou' + i}`] 这个就相当于this.isjiantou0 所以输出的时候直接是值
for(var i=0;i<6;i++){
console.log(`${'jiantou' + i}`) //isjiantou0
console.log(this[`${'jiantou' + i}`]) //true / false
}