实时赋值 this.$set

this.$set 是 Vue.js 框架中的一个方法，用于向响应式对象添加一个属性并确保这个新属性同样是响应式的。它的语法格式为：

this.$set(object, key, value)

其中，object 是要添加属性的响应式对象，key 是新属性的名称，value 是新属性的值。这个方法可以用于解决 Vue.js 监听不到数组或对象元素变化的问题。

举个例子，如果我们有一个 data 对象，其中包含一个数组 fruits：

data: {
  fruits: ['apple', 'banana', 'orange']
}

如果我们想向 fruits 数组中添加一个新元素，我们可以这样做：

this.fruits.push('pear')

但是，Vue.js 无法监听到 fruits 数组的变化，因此页面不会更新。为了解决这个问题，我们可以使用 this.$set 方法来添加新元素：

this.$set(this.fruits, 3, 'pear')

这样做就能够确保 fruits 数组的变化被 Vue.js 监听到并更新页面了。

相关问题

this.$set赋值

this.$set 是 Vue.js 框架中的一个方法，用于在 Vue 实例中设置响应式属性。通常情况下，我们可以直接通过赋值的方式给 Vue 实例的属性赋值，例如 `this.prop = value`，但是如果需要给一个新添加的属性添加响应式，或者修改已有属性的值时，就需要使用 this.$set 方法。

使用方式如下：`this.$set(object, key, value)`。

其中，object 是要操作的对象，key 是要设置的属性名，value 是要设置的值。

举个例子，假设有一个 data 对象：

data: {
  prop: 'initial value'
}

如果我们想给 data 对象添加一个新属性 newProp，并且要保证该属性是响应式的，可以使用 this.$set 方法：

this.$set(this.data, 'newProp', 'new value');

这样就可以保证 newProp 是响应式的，当 newProp 的值发生改变时，相关的视图会自动更新。

this.$http({ url: `${this.tableName}/login?username=${this.rulesForm.username}&password=${this.rulesForm.password}`, method: "post" }).then(({ data }) => { if (data && data.code === 0) { this.$storage.set("Token", data.token); this.$storage.set("role", this.rulesForm.role); this.$storage.set("sessionTable", this.tableName); this.$storage.set("adminName", this.rulesForm.username); this.$router.replace({ path: "/index/" }); } else { this.$message.error(data.msg); } });

这段代码可能在 Vue 组件中被使用，用于向服务器发起登录请求。其中，`this.$http` 可能是一个 Vue 插件，用于发起 HTTP 请求。在请求中，使用了模板字符串和字符串插值的方式构造了请求的 URL，将用户名和密码作为参数传递给服务器进行验证。请求的方法为 `post`，表示向服务器提交数据。

在请求成功后，将服务器返回的数据解构赋值给一个名为 `data` 的变量。如果返回的数据中包含 `code` 属性且值为 0，则表示登录验证通过，将服务器返回的 token 存储到浏览器的本地存储中，同时将角色、表名、用户名等信息存储到本地存储中，并使用 `$router.replace` 方法跳转到首页。如果返回的数据中包含 `msg` 属性，则表示登录验证失败，将失败信息提示给用户。

需要注意的是，该代码中的请求 URL 中可能包含了动态参数，这些参数的值可能是根据用户输入或者其他上下文信息动态生成的。另外，该代码中使用了浏览器的本地存储来存储登录信息和用户状态，这些信息可能包含敏感信息，需要进行适当的加密和保护。