Vue Pinia

直接赋值

默认情况下，直接将store中某个属性赋值给一个新的变量，会丢失响应。

        <div class="form-group">
          <label for="email">邮箱:</label>
          <input
            type="email"
            id="email"
            v-model="store.userInfo.email"
            class="form-control"
            placeholder="请输入邮箱"
          />
        </div>

直接从store上开始写，数值会保留响应。

const userInfo = store.userInfo;

这样写会丢失响应，获得了一份深拷贝。
这个userInfo的改变不会影响到store.userInfo。

解构赋值保留响应

正确写法如下。

const {userInfo} = storeToRefs(store);