胡子哥哥
2019-03-11 12:19:32
練習使用簡單的vuex來傳值store.js:const store = new Vuex.Store({? // 定義狀態? state: {? ? headImg: ""? },? mutations:{? ? newImg(state,msg){? ? ? state.headImg=msg;? ? }? }})傳值:this.$store.commit("newImg",val.HeadImgUrl);接收:<template>? <div>? ? <img :src="msg" alt="">? </div></template><script>? export default {? ? name: 'detail',? ? data () {? ? ? return {? ? ? ? msg: ''? ? ? }? ? },? ? created(){? ? ? this.msg=this.imgSrc;? ? },? ? computed: {? ? ? imgSrc () {? ? ? ? return this.$store.state.headImg; //vuex接受值? ? ? }? ? }</script>問題是在刷新的時候這個值就沒了,怎么讓它在刷新完頁面后還存在這個值呢?(剛學vue沒多久,還請指點)
4 回答

三國紛爭
TA貢獻1804條經驗 獲得超7個贊
store內的狀態刷新后會重新初始化,可以通過本地存儲解決
const store = new Vuex.Store({
// 定義狀態
state: {
headImg: JSON.parse(sessionStorage.getItem('headImg')) || ""
},
mutations:{
newImg(state,msg){
sessionStorage.setItem('headImg', JSON.stringify(msg))
state.headImg=msg;
}
}
})

HUX布斯
TA貢獻1876條經驗 獲得超6個贊
this.$store.commit("newImg",val.HeadImgUrl);這個方法寫到
created(){
this.$store.commit("newImg",val.HeadImgUrl);
this.msg=this.imgSrc;
},
添加回答
舉報
0/150
提交
取消