在日常开发过程，相信大家有遇到过各种需求，而我，在这段事件便遇到了一个，需要通过用户界面配置动态接口，同时，因为是app小程序开发，所以接口中涉及到了http以及websocket两个类型的接口。
同时，因为公司所设计到的大多数都是这类型的框架，因此，想要将其多个项目整合为一个app，页面等布局全部统一，那么，便只能通过给用户开通自己配置ip以及http端口和websocket端口来搞定了。
那么，该如何实现呢，通常情况下，是this.baseurl去实现动态配置变量接口，但是，这个只能满足一个，翻阅了网上大多数资料，没有找到办法，在询问个一个朋友后，了解到了uni中可以将vuex引入进去，
接下来看一下效果再来看一下如何将其引入进去。
通过点击右上角的设置按钮，来实现弹出框
那么，说一下如何将其vuex引入进uni中
首先再目录文件中新建文件夹store，再新建文件夹下层新建js文件index
将一下代码放入Index.Js文件中
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
const store = new Vuex.Store({
state: {
hasLogin: false,
userInfo: {ip:'',port:''},
httpLj:'',
webSocketLj:'',
},
mutations: {
login(state, provider) {
state.hasLogin = true;
state.userInfo = provider;
uni.setStorage({ //缓存用户登陆状态
key: 'userInfo',
data: provider
})
},
logout(state) {
state.hasLogin = false;
state.userInfo = {};
uni.removeStorage({
key: 'userInfo'
})
}
},
actions: {
}
})
export default store然后再其main.js文件中插入进去一下两行代码
Vue.prototype.$store = store
import store from './store'
再登录页面中的script中将其引用
import { mapState, mapMutations } from 'vuex';
import store from '@/store/index.js';
然后就是使用 this.$store 去调用变量了
再该页面输入框输入值之后，将其值存入进去，之后再所有页面都可使用所定义的变量。
如果有不懂的请联系我。
0 条评论
请不要发布违法违规有害信息，如发现请及时举报或反馈！
还没有人评论呢，速度抢占沙发！