小程序共享数据 - 代码实例

// 1.引入store
const { HYEventStore } = require("hy-event-store")
// 引入axios
const axios = require("axios")

// 创建一个仓库
const userStore = new HYEventStore({
  state: {
    name: "why",
    age: 18,

    banners: [],
    recommends: []
  },
  actions: {
    // ctx可以拿到state的数据
    fetchHomeMultidataAction(ctx) {
      axios.get("http://123.207.32.32:8000/home/multidata").then(res => {
        ctx.banners = res.data.data.banner.list
      })
    }
  }
})


// aaa.js中使用共享的数据
// 使用共享的数据  用   onState , 一但是name发生变化,那么就得到
userStore.onState("name", (value) => {
  console.log("name:", value);
  // 这里就可以用 小程序的  setData 来更新数据
})

// 使用共享的数据  用   onState , 一但是banners发生变化,那么就得到
userStore.onState("banners", (value) => {
  console.log("banners:", value)
})

// 使用共享的数据  用   onStates , 一但是name 或者 banners发生变化,那么就得到
userStore.onStates(["name", "banners"], (value) => {
  console.log(value.name);
  console.log(value.banners);
})

// bbb.js改变数据
// 改变共享的数据   用 setState
setTimeout(() => {
  userStore.setState("name", "kobe")

  // 发起  发送请求
  userStore.dispatch("fetchHomeMultidataAction")
}, 2000)

 

posted @ 2022-09-23 10:38  杨建鑫  阅读(129)  评论(0编辑  收藏  举报