vue修改数据问题并实时显示的方法

首先，定义一个变量：

(下面以我的写作为例)

首先，定义一个变量：

然后，为变量赋值：

如果要修改数据，主要代码如下：

然后记得在接口上绑定数据id:

没关系。

扩展知识：Vue刷新并修改页面中的数据方法

因为一旦生成了Vue对象，如果只修改了Vue对象中的数据，就不会在页面上自动更新，所以必须由Vue.set()函数以Vue.set(data，' para '，' value ')的格式进行修改，其中data是创建Vue时传输的数据对象的名称，后两个参数是数据对象中的变量名和值。

页面初始化代码：

脚本类型=' text/JavaScript ' charset=' utf-8 ' mui . init()；var数据={dx: 1400，wcyj: 0，jj: 0，tcbl: 0，tcje: 0，total : 0 }；$(文档)。ready(function(){ var v=new Vue({ El : ' # result '，data : data })})/需要用js修改vue模板中变量的脚本代码：

脚本类型=' text/JavaScript ' function calc(){ $(' # result ')。show()；yj=$(' #姬野')。val()；Vue.set(数据，' wcyj '，yj)；if(yj 40000) {Vue.set(数据，' tcbl '，0.04)；Vue.set(数据，' jj '，0)；} else if(yj 80000) {Vue.set(data，' tcbl '，0.05)；Vue.set(数据，' jj '，400)；} else if(yj 120000) {Vue.set(data，' tcbl '，0.06)；Vue.set(数据，' jj '，1000)；} else {Vue.set(data，' tcbl '，0.07)；Vue.set(数据，' jj '，1500)；}data.tcje=(yj * data.tcbl)。toFixed(1)；data . total=(parseFloat(data . tcje)parseFloat(data . dx)parseFloat(data . jj))；} /script上述修改数据问题并实时显示的vue方法是边肖分享的全部内容。希望能给大家一个参考，支持我们。