From e1045a187b8c4fd95ed657f90e570b1c150bbdd2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=B0=8F=E5=8F=B6=E5=AD=90?= <123546465> Date: Sun, 5 Jul 2020 11:01:21 +0800 Subject: [PATCH 1/3] =?UTF-8?q?=E8=B4=AD=E7=89=A9=E8=BD=A6=E7=A4=BA?= =?UTF-8?q?=E4=BE=8B+vue=E5=9F=BA=E7=A1=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../.gitee/PULL_REQUEST_TEMPLATE.zh-CN.md" | 15 ---- .../css/style.css" | 20 +++++ .../html/index.html" | 58 +++++++++++++ .../html/text.html" | 2 +- .../js/index.js" | 85 +++++++++++++++++++ 5 files changed, 164 insertions(+), 16 deletions(-) delete mode 100644 "\345\260\217\345\217\266\345\255\220/.gitee/PULL_REQUEST_TEMPLATE.zh-CN.md" create mode 100644 "\345\260\217\345\217\266\345\255\220/css/style.css" create mode 100644 "\345\260\217\345\217\266\345\255\220/html/index.html" rename "\345\260\217\345\217\266\345\255\220/text.html" => "\345\260\217\345\217\266\345\255\220/html/text.html" (98%) create mode 100644 "\345\260\217\345\217\266\345\255\220/js/index.js" 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 33948fd..0000000 --- "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 0000000..4b866dc --- /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 0000000..49439da --- /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 054f1d1..0e6cbbc 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 0000000..d9183ea --- /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 -- Gitee From 514a069b0094ecdf06236f8b2f28d6703382e6d4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=A6=82=E5=BA=93=E5=8F=B6=E6=9C=A8?= <7371298+small_leaf_n@user.noreply.gitee.com> Date: Sun, 5 Jul 2020 17:02:14 +0800 Subject: [PATCH 2/3] =?UTF-8?q?=E5=88=A0=E9=99=A4=E6=96=87=E4=BB=B6=20?= =?UTF-8?q?=E5=B0=8F=E5=8F=B6=E5=AD=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../css/style.css" | 20 --- .../css/text.css" | 10 -- .../html/index.html" | 58 -------- .../html/text.html" | 140 ------------------ .../js/index.js" | 85 ----------- 5 files changed, 313 deletions(-) delete mode 100644 "\345\260\217\345\217\266\345\255\220/css/style.css" delete mode 100644 "\345\260\217\345\217\266\345\255\220/css/text.css" delete mode 100644 "\345\260\217\345\217\266\345\255\220/html/index.html" delete mode 100644 "\345\260\217\345\217\266\345\255\220/html/text.html" delete mode 100644 "\345\260\217\345\217\266\345\255\220/js/index.js" 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" deleted file mode 100644 index 4b866dc..0000000 --- "a/\345\260\217\345\217\266\345\255\220/css/style.css" +++ /dev/null @@ -1,20 +0,0 @@ -[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/css/text.css" "b/\345\260\217\345\217\266\345\255\220/css/text.css" deleted file mode 100644 index e765fda..0000000 --- "a/\345\260\217\345\217\266\345\255\220/css/text.css" +++ /dev/null @@ -1,10 +0,0 @@ -.bgcolor{ - background-color: indianred; - height: 40px; - width: 100px; - font-family: sans-serif; - font-size: large; -} -.forecolor{ - color: blue; -} \ 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" deleted file mode 100644 index 49439da..0000000 --- "a/\345\260\217\345\217\266\345\255\220/html/index.html" +++ /dev/null @@ -1,58 +0,0 @@ - - - - - - - - 购物车示例 - - - - - -
- - -
购物车为空呀，快去逛逛商场吧
-
- - - - \ No newline at end of file diff --git "a/\345\260\217\345\217\266\345\255\220/html/text.html" "b/\345\260\217\345\217\266\345\255\220/html/text.html" deleted file mode 100644 index 0e6cbbc..0000000 --- "a/\345\260\217\345\217\266\345\255\220/html/text.html" +++ /dev/null @@ -1,140 +0,0 @@ - - - - - - - Vue中class和style的相关练习 - - - - - -
- - - - - - - - - - - - - - - - - -
- - - - - \ No newline at end of file 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" deleted file mode 100644 index d9183ea..0000000 --- "a/\345\260\217\345\217\266\345\255\220/js/index.js" +++ /dev/null @@ -1,85 +0,0 @@ -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 -- Gitee From 59b74bdf03ac03fdfb66eb2314700386d8624c79 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=B0=8F=E5=8F=B6=E5=AD=90?= <123546465> Date: Sun, 5 Jul 2020 17:04:26 +0800 Subject: [PATCH 3/3] =?UTF-8?q?=E6=9B=B4=E6=96=B0=E8=B4=AD=E7=89=A9?= =?UTF-8?q?=E8=BD=A6+vue=E5=9F=BA=E7=A1=80=E4=BD=9C=E4=B8=9A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../css/style.css" | 20 +++ .../css/text.css" | 10 ++ .../html/index.html" | 58 ++++++++ .../html/text.html" | 140 ++++++++++++++++++ .../js/index.js" | 85 +++++++++++ 5 files changed, 313 insertions(+) create mode 100644 "\345\260\217\345\217\266\345\255\220/css/style.css" create mode 100644 "\345\260\217\345\217\266\345\255\220/css/text.css" create mode 100644 "\345\260\217\345\217\266\345\255\220/html/index.html" create mode 100644 "\345\260\217\345\217\266\345\255\220/html/text.html" create mode 100644 "\345\260\217\345\217\266\345\255\220/js/index.js" 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 0000000..4b866dc --- /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/css/text.css" "b/\345\260\217\345\217\266\345\255\220/css/text.css" new file mode 100644 index 0000000..e765fda --- /dev/null +++ "b/\345\260\217\345\217\266\345\255\220/css/text.css" @@ -0,0 +1,10 @@ +.bgcolor{ + background-color: indianred; + height: 40px; + width: 100px; + font-family: sans-serif; + font-size: large; +} +.forecolor{ + color: blue; +} \ 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 0000000..49439da --- /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/html/text.html" "b/\345\260\217\345\217\266\345\255\220/html/text.html" new file mode 100644 index 0000000..0e6cbbc --- /dev/null +++ "b/\345\260\217\345\217\266\345\255\220/html/text.html" @@ -0,0 +1,140 @@ + + + + + + + Vue中class和style的相关练习 + + + + + +
+ + + + + + + + + + + + + + + + + +
+ + + + + \ No newline at end of file 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 0000000..d9183ea --- /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 -- Gitee