diff --git "a/\345\260\217\345\217\266\345\255\220/.gitee/PULL_REQUEST_TEMPLATE.zh-CN.md" "b/\345\260\217\345\217\266\345\255\220/.gitee/PULL_REQUEST_TEMPLATE.zh-CN.md" deleted file mode 100644 index 33948fdcb51264545ce5ae797f5310a1c06f871d..0000000000000000000000000000000000000000 --- "a/\345\260\217\345\217\266\345\255\220/.gitee/PULL_REQUEST_TEMPLATE.zh-CN.md" +++ /dev/null @@ -1,15 +0,0 @@ -### 相关的Issue - - -### 原因（目的、解决的问题等） - - -### 描述（做了什么，变更了什么） - - -### 测试用例（新增、改动、可能影响的功能） - - - - - diff --git "a/\345\260\217\345\217\266\345\255\220/css/style.css" "b/\345\260\217\345\217\266\345\255\220/css/style.css" new file mode 100644 index 0000000000000000000000000000000000000000..4b866dcf11315545256169d00783505763714ac7 --- /dev/null +++ "b/\345\260\217\345\217\266\345\255\220/css/style.css" @@ -0,0 +1,20 @@ +[v-cloak]{ + display: none; +} +table{ + border: 1px solid #ee99ee; + border-collapse: collapse; + border-spacing: 0; + empty-cells: show; +} +th,td{ + padding: 8px 16px; + border: 1px solid #ee99ee; + text-align: left; +} +th{ + background: #ff77ff; + color: #5c6b77; + font-weight: 600; + white-space: nowrap; +} \ No newline at end of file diff --git "a/\345\260\217\345\217\266\345\255\220/html/index.html" "b/\345\260\217\345\217\266\345\255\220/html/index.html" new file mode 100644 index 0000000000000000000000000000000000000000..49439dad1a68ea1539fff42c61aa5a52f8ebb325 --- /dev/null +++ "b/\345\260\217\345\217\266\345\255\220/html/index.html" @@ -0,0 +1,58 @@ + + + + + + + + 购物车示例 + + + + + +
+ + +
购物车为空呀，快去逛逛商场吧
+
+ + + + \ No newline at end of file diff --git "a/\345\260\217\345\217\266\345\255\220/text.html" "b/\345\260\217\345\217\266\345\255\220/html/text.html" similarity index 98% rename from "\345\260\217\345\217\266\345\255\220/text.html" rename to "\345\260\217\345\217\266\345\255\220/html/text.html" index 054f1d17e485b75517780f7d6a344e1ff05ebc41..0e6cbbc3f4a12e22427f30bf056794f8c1169400 100644 --- "a/\345\260\217\345\217\266\345\255\220/text.html" +++ "b/\345\260\217\345\217\266\345\255\220/html/text.html" @@ -5,7 +5,7 @@ Vue中class和style的相关练习 - + diff --git "a/\345\260\217\345\217\266\345\255\220/js/index.js" "b/\345\260\217\345\217\266\345\255\220/js/index.js" new file mode 100644 index 0000000000000000000000000000000000000000..d9183eab7cca35948af1a2f1b3a723109149854d --- /dev/null +++ "b/\345\260\217\345\217\266\345\255\220/js/index.js" @@ -0,0 +1,85 @@ +var app = new Vue({ + el: "#app", + data: { + // 商品名称，单价，购买数量 + list: [ + { + id: 31, + ProName: "草莓", + ProPrice: 12, + count: 1, + isChecked: true + }, + { + id: 45, + ProName: "荔枝", + ProPrice: 15, + count: 1, + isChecked: true + }, + { + id: 99, + ProName: "甜橙", + ProPrice: 20, + count: 1, + isChecked: true + } + ], + //全选 + inputChecked: true + + }, + + computed: { + totalProice: function () { + + var total = 0; + + for (var i = 0; i < this.list.length; i++) { + + var item = this.list[i]; + + if (item.isChecked === true) { + total += item.ProPrice * item.count; + + } + + } + // replace正则表示分隔符 + return total.toString().replace(/\B(?=(\d{3})+$)/g, ','); + } + }, + methods: { + // count=购买数量 + handleRedece: function (index) { + if (this.list[index].count === 1) return; + this.list[index].count--; + }, + handleAdd: function (index) { + this.list[index].count++; + }, + handleRemove: function (index) { + this.list.splice(index, 1); + }, + handleChange: function () { + this.list.forEach(element => { + element.isChecked = this.inputChecked; + }); + }, + handleChangeOther: function () { + var isFalse = true; + this.list.forEach(element => { + if (element.isChecked === false) { + isFalse = false; + } + }); + + if (isFalse === false) { + this.inputChecked = false; + } else { + this.inputChecked = true; + } + }, + } + +}) \ No newline at end of file