<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>v-set</title>
<script src="js/vue.min.js"></script>
</head>
<body>
<h1>vue.set</h1>
<hr />
<div id="app">
<ul>
<li v-for="val in goods">
{
{val.name}} -- {
{val.num}}
</li>
</ul>
<p>总计{
{count}}件产品</p>
<button @click="clear">清空</button>
</div>
<button onclick="add()">++</button>
</body>
<script>
function add(){
sql.goods.push({name:'garden',num:'1'});
vm.count++;
}
var sql = {
count: 3,
goods: [
{name:'car',num:'2'},
{name:'house',num:'1'}
]
}
var vm = new Vue({
el: '#app',
data: sql,
met
本文介绍了如何使用Vue.js来模拟添加商品到购物车以及清空购物车的功能。通过实例代码展示了Vue组件的运用，包括数据绑定、事件处理等核心特性。
最低0.47元/天 解锁文章
1387
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
