vuex.vue 965 B

12345678910111213141516171819202122232425262728293031323334353637383940
  1. <template>
  2. <view class="u-demo">
  3. <view class="u-demo-wrap">
  4. <view class="u-demo-title">演示效果</view>
  5. <view class="u-demo-area">
  6. <view class="u-no-demo-here">
  7. 此处为演示vuex全局变量的使用
  8. </view>
  9. <view class="u-demo-result-line">
  10. {{vuex_demo}}
  11. </view>
  12. </view>
  13. </view>
  14. <view class="u-config-wrap">
  15. <view class="u-config-title u-border-bottom">
  16. 参数配置
  17. </view>
  18. <view class="u-config-item">
  19. <view class="u-item-title">修改vuex变量为如下值</view>
  20. <u-subsection :list="['墨绿', '黛蓝', '浅紫']" @change="vuexChange"></u-subsection>
  21. </view>
  22. </view>
  23. </view>
  24. </template>
  25. <script>
  26. export default {
  27. methods: {
  28. vuexChange(index) {
  29. let val = index == 0 ? '墨绿' : index == 1 ? '黛蓝' : '浅紫';
  30. // 通过this.$u.vuex使用,方法见uView文档
  31. this.$u.vuex('vuex_demo', val);
  32. }
  33. }
  34. }
  35. </script>
  36. <style lang="scss" scoped>
  37. .u-demo {}
  38. </style>