小程序如何把多个输入框的值存储在本地缓存

小程序可以使用 wx.setStorageSync 方法将多个输入框的值存储在本地缓存中。具体的实现步骤如下：

1. 在 WXML 中，为每个输入框添加一个唯一的 ID。

2. 在对应的 JS 文件中，使用 wx.getStorageSync 方法获取本地缓存中已经存在的数据并赋值给变量。

3. 在监听输入框的事件中，将输入框的值更新到对应的变量中。

4. 在页面关闭或切换时，使用 wx.setStorageSync 方法将所有变量存储到本地缓存中。

以下是一个示例代码：

// WXML 文件
<view>
  <input id="input1" bindinput="bindInput1" value="{{value1}}" />
  <input id="input2" bindinput="bindInput2" value="{{value2}}" />
  <button bindtap="saveData">保存数据</button>
</view>

// JS 文件
Page({
  data: {
    value1: '',
    value2: ''
  },

  onLoad: function () {
    // 获取本地缓存中已经存在的数据
    const data = wx.getStorageSync('data');
    if (data) {
      this.setData({
        value1: data.value1 || '',
        value2: data.value2 || ''
      });
    }
  },

  bindInput1: function (event) {
    // 更新输入框1的值
    this.setData({
      value1: event.detail.value
    });
  },

  bindInput2: function (event) {
    // 更新输入框2的值
    this.setData({
      value2: event.detail.value
    });
  },

  saveData: function () {
    // 存储所有变量到本地缓存中
    wx.setStorageSync('data', {
      value1: this.data.value1,
      value2: this.data.value2
    });
  }
});

这样，每次打开小程序时，就能够恢复之前保存的输入框的值了。