global.vue 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. <template>
  2. <view class="pa">
  3. <view class="uni-divider">
  4. <view class="uni-divider__content">globalData</view>
  5. <view class="uni-divider__line"></view>
  6. </view>
  7. <text class="text">globalData中text的值: {{gd.test}}</text>
  8. <button @click="setGD()" class="button">修改上述值为123</button>
  9. <view class="uni-divider">
  10. <view class="uni-divider__content">vuex</view>
  11. <view class="uni-divider__line"></view>
  12. </view>
  13. <text class="text">vuex中hasLogin的值: {{testvuex}}</text>
  14. <button @click="setVUEX(true)" class="button">修改上述值为true</button>
  15. <button @click="setVUEX(false)" class="button">修改上述值为false</button>
  16. </view>
  17. </template>
  18. <script>
  19. import {
  20. mapState,
  21. mapMutations
  22. } from 'vuex'
  23. export default {
  24. data() {
  25. return {
  26. gd:{}
  27. }
  28. },
  29. computed: {
  30. ...mapState(['testvuex'])
  31. },
  32. methods: {
  33. ...mapMutations(['setTestTrue']),
  34. ...mapMutations(['setTestFalse']),
  35. setGD:function () {
  36. this.gd.test="123"
  37. },
  38. setVUEX:function (isTrue) {
  39. // console.log("this.testvuex: " + this.testvuex);
  40. // this.hasLogin = true; 这样赋值不生效,必须用store/index.js里注册的mapMutations才行
  41. if(isTrue){
  42. this.setTestTrue(this.$store.state);
  43. }
  44. else{
  45. this.setTestFalse(this.$store.state);
  46. }
  47. // console.log("this.testvuex: " + this.testvuex);
  48. }
  49. },
  50. onShow() {
  51. this.gd = getApp().globalData
  52. }
  53. }
  54. </script>
  55. <style>
  56. .button {
  57. margin: 30rpx;
  58. color: #007AFF;
  59. }
  60. .text{
  61. margin-left: 30rpx;
  62. }
  63. </style>