Program:
index.html:
index.js:
Output:
index.html:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="ad">
{{ message }}
<br>
The Initial Price is {{ discount(20) }}
<br>
The Final Price is {{ discountp(90) }}
</div>
<script src="https://unpkg.com/vue"></script>
<script type="text/javascript" src="./index.js"> </script>
</body>
</html>
index.js:
var app = new Vue({
el: '#ad',
data: {
message: 'Hello World',
price: '1000',
},
methods: {
discount: function () {
cost = this.price - 10;
return cost;
},
discountp: function (a) {
cost = this.price - a;
return cost;
}
}
});
Output:
