html5 - vuex storage problem in vue project
迷茫
迷茫 2017-06-27 09:19:31
0
2
863

Achievement effect: Click the button to switch the width of the left menu.

I have now used Vuex to store a field IsOpen, and then both the nav component and the menu component have obtained the initial value of the field, and they also switch when the nav component button is clicked. The value of IsOpen, but the class name that changes the width is not switched.

This is the code for nav formation:

This is the code of the menu component:

迷茫
迷茫

业精于勤,荒于嬉;行成于思,毁于随。

reply all(2)
迷茫

import { mapGetters } from 'vuex'

export {

computed: mapGetters['toggleClass']

}

Write the code to switch styles in the getters file of the warehouse

Peter_Zhu

Please read the vuex documentation carefully

Vuex’s state storage is reactive. When the Vue component reads the state from the store, if the state in the store
changes, the corresponding component will be efficiently updated accordingly.


You can directly bind vuex data to your tags

<p v-bind:class="[this.$store.getters.isOpen ? 'openWidth', 'closeWidth']"></p>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!