Vue.js 品牌展示表格 - 动态渲染数据
| 序号 | 品牌名称 | 企业名称 | 排序 | 品牌介绍 | 状态 | 操作 |
|---|---|---|---|---|---|---|
| {{index+1}} | {{brand.brandName}} | {{brand.companyName}} | {{brand.ordered}} | {{brand.description}} | 启用 停用 | 修改 删除 |
<!--1 引入js文件-->
<script src="js/vue.js"></script>
<!--2 定义Vue对象,初始化模型数据-->
<script>
new Vue({
el: "#app",
data: {
brands: [{
brandName: '三只松鼠',
companyName: '三只松鼠',
ordered: '100',
description: '三只松鼠,好吃不上火',
status: 1
}, {
brandName: '优衣库',
companyName: '优衣库',
ordered: '10',
description: '优衣库,服适人生',
status: 0
}, {
brandName: '小米',
companyName: '小米科技有限公司',
ordered: '1000',
description: '为发烧而生',
status: 0
}, {
brandName: '华为',
companyName: '华为科技有限公司',
ordered: '100',
description: '没有伤痕累累,哪来皮糙肉厚,英雄自古多磨难',
status: 1
}]
}
});
</script>
原文地址: https://www.cveoy.top/t/topic/qvmZ 著作权归作者所有。请勿转载和采集!