您好,登錄后才能下訂單哦!
小編給大家分享一下vue.js如何刷新改變數(shù)據(jù),希望大家閱讀完這篇文章后大所收獲,下面讓我們一起去探討吧!
vue.js刷新改變數(shù)據(jù)的方法:使用函數(shù)【Vue.set()】來進行修改,函數(shù)格式為【Vue.set(data,'para','value')】,其中data為Vue創(chuàng)建時傳輸?shù)膁ata對象名。
vue.js刷新改變數(shù)據(jù)的方法:
因為Vue對象一旦生成之后,如果只是修改Vue對象中的數(shù)據(jù),在頁面上是不會自動更新的,得用Vue.set()
函數(shù)來進行修改,函數(shù)格式為Vue.set(data,'para','value')
其中data為Vue創(chuàng)建時傳輸?shù)膁ata對象名,后面兩個參數(shù)分別是data對象中的變量名稱與值
頁面初始化代碼:
<script type="text/javascript" charset="utf-8"> mui.init(); var data = { dx: 1400, wcyj: 0, jj: 0, tcbl: 0, tcje: 0, total: 0 }; $(document).ready(function() { var v = new Vue({ el: '#result', data: data }) }) </script>
需要用js對Vue模板中的變量進行修改的代碼:
<script type="text/javascript"> function calc() { $("#result").show(); yj = $("#yeji").val(); Vue.set(data, 'wcyj', yj); if(yj < 40000) { Vue.set(data, 'tcbl', 0.04); Vue.set(data, 'jj', 0); } else if(yj < 80000) { Vue.set(data, 'tcbl', 0.05); Vue.set(data, 'jj', 400); } else if(yj < 120000) { Vue.set(data, 'tcbl', 0.06); Vue.set(data, 'jj', 1000); } else { Vue.set(data, 'tcbl', 0.07); Vue.set(data, 'jj', 1500); } data.tcje = (yj * data.tcbl).toFixed(1); data.total = (parseFloat(data.tcje) + parseFloat(data.dx) + parseFloat(data.jj)); } </script>
看完了這篇文章,相信你對vue.js如何刷新改變數(shù)據(jù)有了一定的了解,想了解更多相關知識,歡迎關注億速云行業(yè)資訊頻道,感謝各位的閱讀!
免責聲明:本站發(fā)布的內容(圖片、視頻和文字)以原創(chuàng)、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關證據(jù),一經查實,將立刻刪除涉嫌侵權內容。