setData存数据，但AppData中的数据不更新

Question

使用setData存数据，但是AppData中的数据不更新是怎么回事啊？

Page({
  // 链接可能会过期换成自己的就行
    data:{
       //"audioUrl": "https://dl.stream.qqmusic.qq.com/C4000026gMkr1L9tKN.m4a?guid=7840612806&vkey=4696DBD6111F38EC3D75D0F4FDF769B3736068A795CF585BA18DF3A4BCD8F83D0662B54D70F64934AF74A34C9A354AFF0AA4660CCE4C66F0&uin=&fromtag=120032",
      videoUrl: "C:/Users/priesty/Desktop/caogao/test.mp4",
      videoInfo: {},
      canvasWidth: 0,
      canvasHeight: 0,
      fps: 0,
      duration: 0,
      imageList: [],
      tempFilePath:"",
    },
    onLoad: function (){
      console.log("开始"),
      this.videoDecoderStart()
    },

     // async是异步的意思，会返回一个promise对象，而awite会等待这个async的promise完成 并将reslove的结果返回出来
    /* async videoDecoderStart() { */
    videoDecoderStart() {  
      // 自己选择视频
      const that = this
/*       var tempFilePath = await wx.chooseMedia( */
      //const tempFilePath =  wx.chooseMedia(
      wx.chooseMedia({
        mediaType: ['video'],  //设置文件类型为视频
        sourceType: ['album'],
        success(res){
          console.log(res);     //这个能打印出来
          console.log("结果")
          if(res){
            
            //that.data.duration = res.tempFiles[0].duration
            //this.setData({ 
            that.setData({                 //在data维护一组数据 ，感觉没有存成功！！！！！！！！
              tempFilePath: res.tempFiles[0].tempFilePath,
              //duration : that.data.duration,
              duration : res.tempFiles[0].duration,
              canvasWidth: res.tempFiles[0].width,
              canvasHeight: res.tempFiles[0].height
            }, () => {
              // 创建视频解析器
             /* this.videoDecoder = wx.createVideoDecoder() */
             that.videoDecoder = wx.createVideoDecoder()
             const {
                canvas,
                context
            } = that.initOffscreenCanvas(that.data.canvasWidth, that.data.canvasWidth)
              that.videoDecoder.on("start", () => {
                that.videoDecoder.seek(0)
                that.timer = setInterval(() => {
                  that.getFrameData(canvas, context)
                }, 300);
              })
              that.videoDecoder.on("seek", () => {})
              that.videoDecoder.on("stop", () => {})
              that.videoDecoder.start({
                source: tempFilePath
              })
            })   
          }         
          console.log(that.data.duration)
          console.log(that.data.tempFilePath)        //能显示，但不能存进AppData ？？？？？？
          console.log(that.data.canvasWidth)
          console.log(that.data.canvasHeight)

        }
      })
      //const tempFilePath = that.data.tempFilePath
      console.log("选择")
      console.log( that.data.tempFilePath)    //这里也无法显示数据！！！！！显示未定义！！！！！为什么啊！！
      
    }
}

Answer 1

【以下回答由 GPT 生成】

问题的原因是setData方法是用于更新页面数据的，而不是存储数据到AppData中。要存储数据到AppData中以便在不同页面之间共享数据，可以使用小程序的全局变量或者缓存机制。

可以根据需求选择使用全局变量或者缓存机制来存储数据，以下是使用全局变量和缓存机制的解决方案：

1. 使用全局变量： 在App.js文件中定义一个全局变量来存储数据，将数据存储在全局变量中后可以在项目的任何一个页面中访问和更新该数据。

在App.js文件中定义一个全局变量： javascript App({ globalData: { videoInfo: {} } })

在需要存储数据的页面中使用全局变量： ```javascript // 引入App.js文件 const app = getApp();

// 在setData中设置全局变量的值 app.globalData.videoInfo = res.tempFiles[0].duration;

// 在其他页面中访问全局变量的值 const videoInfo = app.globalData.videoInfo; ```

注意：全局变量只能在小程序运行期间共享数据，小程序关闭后数据将丢失。

1. 使用缓存机制： 使用小程序的缓存机制可以将数据存储在本地，即使小程序关闭也可以保留数据。可以使用wx.setStorage和wx.getStorage方法来实现。

将数据存储到缓存中： javascript wx.setStorage({ key: "videoInfo", data: res.tempFiles[0].duration });

从缓存中获取数据： javascript wx.getStorage({ key: "videoInfo", success(res) { const videoInfo = res.data; } });

注意：缓存机制是将数据存储在用户的手机上，所以可以在不同的小程序版本之间保留数据。

以上是两种常见的存储数据的方式，根据具体需求选择合适的方式来解决问题。

如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^