{"id":29003,"date":"2024-11-25T08:46:26","date_gmt":"2024-11-25T00:46:26","guid":{"rendered":"https:\/\/fwq.ai\/blog\/29003\/"},"modified":"2024-11-25T08:46:26","modified_gmt":"2024-11-25T00:46:26","slug":"%e5%be%ae%e4%bf%a1%e5%b0%8f%e7%a8%8b%e5%ba%8f%e5%bc%80%e5%8f%91%e8%b4%ad%e7%89%a9%e8%bd%a6%e7%9a%84%e5%ae%9e%e4%be%8b%e4%bb%a3%e7%a0%81","status":"publish","type":"post","link":"https:\/\/fwq.ai\/blog\/29003\/","title":{"rendered":"\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u5f00\u53d1\u8d2d\u7269\u8f66\u7684\u5b9e\u4f8b\u4ee3\u7801"},"content":{"rendered":"

\u8fd9\u7bc7\u6587\u7ae0\u4e3b\u8981\u4ecb\u7ecd\u4e86\u5fae\u4fe1\u5c0f\u7a0b\u5e8f \u8d2d\u7269\u8f66\u7b80\u5355\u5b9e\u4f8b\u7684\u76f8\u5173\u8d44\u6599,\u9700\u8981\u7684\u670b\u53cb\u53ef\u4ee5\u53c2\u8003\u4e0b<\/p>\n

\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\uff0c\u8fd9\u91cc\u5b9e\u73b0\u8d2d\u7269\u8f66\u529f\u80fd\u7684\u5c0fdemo,\u6709\u9700\u8981\u6b64\u529f\u80fd\u7684\u670b\u53cb\u53ef\u4ee5\u53c2\u8003\u4e0b\u3002<\/p>\n

: \u52a0\u51cf\u5546\u54c1\u6570\u91cf\uff0c\u6c47\u603b\u4ef7\u683c\uff0c\u5168\u9009\u4e0e\u5168\u4e0d\u9009<\/p>\n

\u8bbe\u8ba1\u601d\u8def\uff1a<\/strong><\/p>\n

\u4e00\u3001\u4ece\u7f51\u7edc\u5165\u4ee5\u4e0b\u6570\u636e\u683c\u5f0f\u7684 1.\u8d2d\u7269\u8f66id\uff1acid 2.\u6807\u9898title 3.\u6570\u91cfnum 4.\u5730\u5740 5.\u4ef7\u683cprice 6.\u5c0f\u8ba1 7.\u662f\u5426\u9009\u4e2dselected<\/p>\n

\u4e8c\u3001\u70b9\u51fbtoggle\u64cd\u4f5c \u5982\u5df2\u7ecf\u9009\u4e2d\u7684\uff0c\u7ecf\u70b9\u51fb\u53d8\u6210\u672a\u9009\u4e2d\uff0c\u53cd\u4e4b\u800c\u53cd\u4e4b \u70b9\u51fb\u4f9d\u636eindex\u4f5c\u4e3a\u6807\u8bc6\uff0c\u800c\u4e0d\u7528cid\uff0c\u65b9\u4fbf\u904d\u5386<\/p>\n

\u4e09\u3001\u5168\u9009\u64cd\u4f5c \u9996\u6b21\u70b9\u51fb\u5373\u4e3a\u5168\u90e8\u9009\u4e2d\uff0c\u518d\u6b21\u70b9\u51fb\u4e3a\u5168\u4e0d\u9009\uff0c\u5168\u9009\u672c\u8eab\u4e5f\u8ddf\u968ftoggle\u53d8\u6362<\/p>\n

\u56db\u3001\u70b9\u51fb\u7ed3\u7b97\u6309\u94ae\uff0c\u5c06\u5df2\u9009\u4e2d\u7684cid\u6570\u7ec4\u53d6\u51fa\uff0c\u4ee5\u4f9b\u901a\u8fc7\u7f51\u7edc\u63d0\u4ea4\u5230\u670d\u52a1\u7aef\uff0c\u8fd9\u91cc\u7ed9\u4e2atoast\u4f5c\u4e3a\u7ed3\u679c\u6f14\u793a\u3002<\/p>\n

\u4e94\u3001\u5229\u7528stepper\u4f5c\u52a0\u51cf\u8fd0\u7b97\uff0c\u540c\u6837\u4f9d\u636eindex\u4f5c\u4e3a\u6807\u8bc6\uff0c\u70b9\u5b8c\u5199\u56denum\u503c\u3002<\/p>\n

\u516d\u3001\u5e03\u5c40\uff0c\u5168\u9009\u4e0e\u7ed3\u7b97\u6309\u94ae\u5e95\u90e8\u5bf9\u9f50\uff0c\u8d2d\u7269\u8f66\u5546\u57ce\u81ea\u9002\u5e94\u9ad8\u5ea6\uff0c\u7c7b\u4f3c\u4e8e\u7684weight\u3002<\/p>\n

\u6b65\u9aa4\uff1a<\/strong><\/p>\n

\u521d\u59cb\u6570\u636e\u6e32\u67d3<\/p>\n

1.1 \u5e03\u5c40\u4e0e\u6837\u5f0f\u8868<\/p>\n

\u4e0a\u65b9\u662f\u4e00\u4e2a\u5546\u54c1\u5217\u8868\uff0c\u4e0b\u65b9\u662f\u4e00\u4e2a\u5168\u9009\u6309\u94ae\u4e0e\u7acb\u5373\u7ed3\u7b97\u6309\u94ae<\/p>\n

\u5546\u54c1\u5217\u8868\u5de6\u90e8\u4e3a\u5546\u54c1\uff0c\u53f3\u4e0a\u4e3a\u5546\u54c1\u6807\u9898\uff0c\u53f3\u4e0b\u4e3a\u5546\u54c1\u4ef7\u683c\u4e0e\u6570\u91cf\uff0c\u5176\u4e2d\u5546\u54c1\u6570\u91cf\u4f7f\u7528WXStepper\u6765\u5b9e\u73b0\u52a0\u51cf\u64cd\u4f5c<\/p>\n

js\uff1a\u521d\u59cb\u5316\u4e00\u4e2a\u6570\u636e\u6e90\uff0c\u8fd9\u5f80\u5f80\u662f\u4ece\u7f51\u7edc\u83b7\u53d6\u7684\uff0c\u76f8\u5173\u53ef\u53c2\u89c1\uff1ahttp:\/\/www.php.cn\/<\/p>\n

<\/p>\n

Page({\r\n  data:{\r\n    carts: [\r\n      {cid:1008,title:'Zippo\u6253\u706b\u673a',image:'https:\/\/img12.360buyimg.com\/n7\/jfs\/t2584\/348\/1423193442\/572601\/ae464607\/573d5eb3N45589898.jpg',num:'1',price:'198.0',sum:'198.0',selected:true},\r\n      {cid:1012,title:'iPhone7 Plus',image:'https:\/\/img13.360buyimg.com\/n7\/jfs\/t3235\/100\/1618018440\/139400\/44fd706e\/57d11c33N5cd57490.jpg',num:'1',price:'7188.0',sum:'7188.0',selected:true},\r\n      {cid:1031,title:'\u5f97\u529b\u8ba2\u4e66\u673a',image:'https:\/\/img10.360buyimg.com\/n7\/jfs\/t2005\/172\/380624319\/93846\/b51b5345\/5604bc5eN956aa615.jpg',num:'3',price:'15.0',sum:'45.0',selected:false},\r\n      {cid:1054,title:'\u5eb7\u5e08\u5085\u5999\u8299\u86cb\u7cd5',image:'https:\/\/img14.360buyimg.com\/n7\/jfs\/t2614\/323\/914471624\/300618\/d60b89b6\/572af106Nea021684.jpg',num:'2',price:'15.2',sum:'30.4',selected:false},\r\n      {cid:1063,title:'\u82f1\u96c4\u94a2\u7b14',image:'https:\/\/img10.360buyimg.com\/n7\/jfs\/t1636\/60\/1264801432\/53355\/bb6a3fd1\/55c180ddNbe50ad4a.jpg',num:'1',price:'122.0',sum:'122.0',selected:true},\r\n    ]\r\n  }\r\n})<\/pre>\n
 \u767b\u5f55\u540e\u590d\u5236 <\/p>\n
\u5e03\u5c40\u6587\u4ef6<\/strong><\/p>\n
<\/p>\n
<view>\r\n  <view>\r\n    <view>\r\n     <image><\/image>\r\n    <\/view>\r\n   <view>\r\n    <text>{{item.title}}<\/text>\r\n    <view>\r\n     <text>{{item.sum}}<\/text>\r\n     <text>WXStepper<\/text>\r\n    <\/view>\r\n   <\/view>\r\n  <\/view><\/view><\/pre>\n
 \u767b\u5f55\u540e\u590d\u5236 <\/p>\n
\u6837\u5f0f\u8868<\/strong><\/p>\n
<\/p>\n
\/*\u5916\u90e8\u5bb9\u5668*\/\r\n.container {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  box-sizing: border-box;\r\n} \r\n\r\n\/*\u6574\u4f53\u5217\u8868*\/\r\n.carts-list {\r\n  display: flex;\r\n  flex-direction: column;\r\n  padding: 20rpx 40rpx;\r\n}\r\n\r\n\/*\u6bcf\u884c\u5355\u5143\u683c*\/\r\n.carts-item {\r\n  display: flex;\r\n  flex-direction: row;\r\n  height:150rpx;\r\n  \/*width\u5c5e\u6027\u89e3\u51b3\u6807\u9898\u6587\u5b57\u592a\u77ed\u800c\u7f29\u7565\u56fe\u504f\u79fb*\/\r\n  width:100%;\r\n  border-bottom: 1px solid #eee;\r\n  padding: 30rpx 0;\r\n}\r\n\r\n\/*\u5de6\u90e8\u56fe\u7247*\/\r\n.carts-image {\r\n  width:150rpx;\r\n  height:150rpx;\r\n}\r\n\r\n\r\n\/*\u53f3\u90e8\u63cf\u8ff0*\/\r\n.carts-text {\r\n  width: 100%;\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: space-between;\r\n}\r\n\r\n\/*\u53f3\u4e0a\u90e8\u5206\u6807\u9898*\/\r\n.carts-title {\r\n  margin: 10rpx;\r\n  font-size: 30rpx;\r\n}\r\n\r\n\/*\u53f3\u4e0b\u90e8\u5206\u4ef7\u683c\u4e0e\u6570\u91cf*\/\r\n.carts-subtitle {\r\n  font-size: 25rpx;\r\n  color:darkgray;\r\n  padding: 0 20rpx;\r\n  display: flex;\r\n  flex-direction: row;\r\n  justify-content:space-between;\r\n}\r\n\r\n\/*\u4ef7\u683c*\/\r\n.carts-price {\r\n  color: #f60;\r\n}<\/pre>\n
 \u767b\u5f55\u540e\u590d\u5236 <\/p>\n
\"\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u5f00\u53d1\u8d2d\u7269\u8f66\u7684\u5b9e\u4f8b\u4ee3\u7801\u63d2\u56fe\"<\/p>\n
1.2 \u96c6\u6210WXStepper<\/p>\n
1.2.1 \u590d\u5236\u7ec4\u4ef6\u5185\u5bb9<\/p>\n
[2016-10-16]<\/p>\n
\u5c06stepper.\u7684\u5185\u5bb9\u590d\u5236\u5230cart.wxss\u4e2d<\/p>\n
\u5c06stepper.wxml\u7684\u5185\u5bb9\u590d\u5236\u5230cart.wxml\u4e2d<\/p>\n
\u4e0e\u4e4b\u524d\u7684\u5355\u4e00\u7ec4\u4ef6\u4e0d\u540c\u7684\u662f\uff1a\u8fd9\u91cc\u8981\u5b9a\u4e49\u6570\u7ec4minusStatuses\u6765\u4e0e\u6bcf\u4e00\u4e2a\u52a0\u51cf\u6309\u94ae\u76f8\u5e94\u3002\u5f53\u7136\uff0c\u5408\u5e76\u5165carts\u4e5f\u662f\u6ca1\u95ee\u9898\u7684\u3002<\/p>\n
        minusStatuses: [‘disabled’, ‘disabled’, ‘normal’, ‘normal’, ‘disabled’]<\/p>\n
\u539f\u6765\u7684\u5b57\u7b26WXStepper\u6362\u6210\u4ee5\u4e0b\u7684\u4ee3\u7801<\/p>\n
<\/p>\n
 <view>\r\n        <!-- \u51cf\u53f7 -->\r\n        <text>-<\/text>\r\n        <!-- \u6570\u503c -->\r\n        <input>\r\n        <!-- \u52a0\u53f7 -->\r\n        <text>+<\/text>\r\n       <\/view><\/pre>\n
 \u767b\u5f55\u540e\u590d\u5236 <\/p>\n
js\u4ee3\u7801bindMinus\u3001bindPlus\u5206\u522b\u6539\u9020\u4e3a\u5982\u4e0b\uff1a<\/p>\n
<\/p>\n
bindMinus: function(e) {\r\n    var index = parseInt(e.currentTarget.dataset.index);\r\n    var num = this.data.carts[index].num;\r\n    \/\/ \u5982\u679c\u53ea\u67091\u4ef6\u4e86\uff0c\u5c31\u4e0d\u5141\u8bb8\u518d\u51cf\u4e86\r\n    if (num &gt; 1) {\r\n      num --;\r\n    }\r\n    \/\/ \u53ea\u6709\u5927\u4e8e\u4e00\u4ef6\u7684\u65f6\u5019\uff0c\u624d\u80fdnormal\u72b6\u6001\uff0c\u5426\u5219disable\u72b6\u6001\r\n    var minusStatus = num <p>\u6548\u679c\u5982\u56fe\uff1a<\/p><p><img src=\"https:\/\/img.php.cn\/upload\/article\/000\/000\/013\/853f7089b3453e741514441dd75b3abf-1.png\" alt=\"\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u5f00\u53d1\u8d2d\u7269\u8f66\u7b80\u5355\u5b9e\u4f8b\u4ee3\u7801\"    style=\"max-width:90%\"  style=\"max-width:90%\" title=\"\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u5f00\u53d1\u8d2d\u7269\u8f66\u7b80\u5355\u5b9e\u4f8b\u4ee3\u7801\"><\/p><p>[2016-10-17]<\/p><p>\u4fee\u6b63\u624b\u5de5\u6539\u52a8\u6570\u91cf\u4fdd\u5b58\u5230\u6570\u7ec4<\/p><p>1.3 \u96c6\u6210LXCheckboxGroup<\/p><p>\u590d\u5236\u5e03\u5c40\u6587\u4ef6\u4ee3\u7801\u5230wxml\uff0c\u8fd9\u91cc\u9700\u8981\u5224\u65ad\u4e00\u4e0b\u5df2\u9009\u72b6\u6001\uff0c\u4e00\u822c\u8d2d\u7269\u8f66\u52fe\u9009\u72b6\u6001\u662f\u8bb0\u5f55\u5728\u7f51\u7edc\u7684\u3002<\/p><p>index\u503c\u7528\u4e8e<a href=\"http:\/\/www.php.cn\/code\/5714.html\" target=\"_blank\">\u4f20\u503c<\/a>js\uff0c\u904d\u5386\u4e4b\u7528\u3002<\/p><p>      <\/p><p class=\"jb51code\"><br><\/p><pre class=\"brush:xml;\"> <!-- \u590d\u9009\u6846\u56fe\u6807 -->\r\n    <icon><\/icon>\r\n    <icon><\/icon><\/pre>\n
 \u767b\u5f55\u540e\u590d\u5236 <\/p>\n
\u590d\u9009\u6846\u5c45\u4e2d<\/p>\n
<\/p>\n
\/*\u590d\u9009\u6846\u6837\u5f0f*\/\r\n.carts-list icon {\r\n  margin-top: 60rpx;\r\n  margin-right: 20rpx;\r\n}<\/pre>\n
 \u767b\u5f55\u540e\u590d\u5236 <\/p>\n
\u7ed1\u5b9a\u70b9\u51fb\u590d\u9009\u6846\uff0c\u5bf9\u9009\u62e9\u72b6\u6001\u505a\u53cd\u9009\u64cd\u4f5c\u3002<\/p>\n
<\/p>\n
  bindCheckbox: function(e) {\r\n    \/*\u7ed1\u5b9a\u70b9\u51fb\u4e8b\u4ef6\uff0c\u5c06checkbox\u6837\u5f0f\u6539\u53d8\u4e3a\u9009\u4e2d\u4e0e\u975e\u9009\u4e2d*\/\r\n    \/\/\u62ff\u5230\u4e0b\u6807\u503c\uff0c\u4ee5\u5728carts\u4f5c\u904d\u5386\u6307\u793a\u7528\r\n    var index = parseInt(e.currentTarget.dataset.index);\r\n    \/\/\u539f\u59cb\u7684icon\u72b6\u6001\r\n    var selected = this.data.carts[index].selected;\r\n    var carts = this.data.carts;\r\n    \/\/ \u5bf9\u52fe\u9009\u72b6\u6001\u53d6\u53cd\r\n    carts[index].selected = !selected;\r\n    \/\/ \u5199\u56de\u7ecf\u70b9\u51fb\u4fee\u6539\u540e\u7684\u6570\u7ec4\r\n    this.setData({\r\n      carts: carts\r\n    });\r\n  }<\/pre>\n
 \u767b\u5f55\u540e\u590d\u5236 <\/p>\n
\u6548\u679c\u56fe\uff1a<\/p>\n
\"\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u5f00\u53d1\u8d2d\u7269\u8f66\u7684\u5b9e\u4f8b\u4ee3\u7801\u63d2\u56fe1\"<\/p>\n
1.4 \u52a0\u5165\u5168\u9009\u4e0e\u7acb\u5373\u7ed3\u7b97\u6309\u94ae<\/p>\n
1.4.1 \u4fee\u6539\u5e03\u5c40\u6587\u4ef6\uff0c\u5b9e\u73b0\u4e0a\u8ff0\u6309\u94ae\u5e95\u90e8\u5bf9\u9f50\uff0c\u4f7f\u7528flex\u4e0e\u56fa\u5b9a\u9ad8\u5ea6\u6765\u5b8c\u6210\u3002<\/p>\n
\u51cf\u5c11\u4e3a3\u884c\uff0c\u770b\u662f\u5426\u8fd8\u5728\u6700\u5e95\uff1b\u6b64\u5916\uff0c\u8fd8\u8981\u4fdd\u8bc1\u60ac\u6d6e\u5728\u5e95\u90e8\uff0c\u4e0d\u88ab\u5217\u8868\u9879\u7684\u6eda\u52a8\u800c\u6eda\u52a8\u3002<\/p>\n
<\/p>\n
 <view>\r\n    <view>\r\n      <icon><\/icon>\r\n      <icon><\/icon>\r\n      <text>\u5168\u9009<\/text>\r\n    <\/view>\r\n    <view>\u7acb\u5373\u7ed3\u7b97<\/view>\r\n  <\/view><\/pre>\n
 \u767b\u5f55\u540e\u590d\u5236 <\/p>\n
\u4e4b\u524d\u7528\u7acb\u5373\u7ed3\u7b97\u6765\u5b9e\u73b0\uff0c\u53d1\u73b0\u65e0\u8bba\u5982\u4f55\u90fd\u4e0d\u80fd\u5b9e\u73b0\u5168\u9009\u90e8\u4ef6\u4e0e\u7ed3\u7b97\u6309\u94ae\u5206\u6563\u5bf9\u9f50\uff0c\u4e0d\u54cd\u5e94\u5982\u4e0b\u6837\u5f0f<\/p>\n
<\/p>\n
  display: flex;\r\n  flex-direction: row;\r\n  justify-content: space-between;<\/pre>\n
 \u767b\u5f55\u540e\u590d\u5236 <\/p>\n
\u6837\u5f0f\u8868<\/p>\n
<\/p>\n
\/*\u5e95\u90e8\u6309\u94ae*\/\r\n.carts-footer {\r\n  width: 100%;\r\n  height: 80rpx;\r\n  display: flex;\r\n  flex-direction: row;\r\n  justify-content: space-between;\r\n}\r\n\r\n\/*\u590d\u9009\u6846*\/\r\n.carts-footer icon {\r\n  margin-left: 20rpx;\r\n}\r\n\r\n\/*\u5168\u9009\u5b57\u6837*\/\r\n.carts-footer text {\r\n  font-size: 30rpx;\r\n  margin-left: 8rpx;\r\n  line-height: 10rpx;\r\n}\r\n\r\n\/*\u7acb\u5373\u7ed3\u7b97\u6309\u94ae*\/\r\n.carts-footer .button {\r\n  line-height: 80rpx;\r\n  text-align: center;\r\n  width:220rpx;\r\n  height: 80rpx;\r\n  background-color: #f60;\r\n  color: white;\r\n  font-size: 36rpx;\r\n  border-radius: 0;\r\n  border: 0;\r\n}<\/pre>\n
 \u767b\u5f55\u540e\u590d\u5236 <\/p>\n
1.4.2 \u5168\u9009\u4e0e\u5168\u4e0d\u9009\u4e8b\u4ef6<\/p>\n
\u5b9e\u73b0bindSelectAll\u4e8b\u4ef6\uff0c\u6539\u53d8\u5168\u9009\u72b6\u6001<\/p>\n
\u9996\u5148\u5b9a\u4e49\u4e00\u4e2adata\u503c\uff0c\u4ee5\u8bb0\u5f55\u5168\u9009\u72b6\u6001<\/p>\n
selectedAllStatus: false<\/p>\n
\u4e8b\u4ef6\u5b9e\u73b0\uff1a<\/p>\n
<\/p>\n
 bindSelectAll: function() {\r\n    \/\/ \u73af\u5883\u4e2d\u76ee\u524d\u5df2\u9009\u72b6\u6001\r\n    var selectedAllStatus = this.data.selectedAllStatus;\r\n    \/\/ \u53d6\u53cd\u64cd\u4f5c\r\n    selectedAllStatus = !selectedAllStatus;\r\n    \/\/ \u8d2d\u7269\u8f66\u6570\u636e\uff0c\u5173\u952e\u662f\u5904\u7406selected\u503c\r\n    var carts = this.data.carts;\r\n    \/\/ \u904d\u5386\r\n    for (var i = 0; i <p><img src=\"https:\/\/img.php.cn\/upload\/article\/000\/000\/013\/3428ce4d687fb071e0195a55eb586631-3.png\" alt=\"\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u5f00\u53d1\u8d2d\u7269\u8f66\u7b80\u5355\u5b9e\u4f8b\u4ee3\u7801\"    style=\"max-width:90%\"  style=\"max-width:90%\" title=\"\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u5f00\u53d1\u8d2d\u7269\u8f66\u7b80\u5355\u5b9e\u4f8b\u4ee3\u7801\"><\/p><p>1.4.3 \u7acb\u5373\u7ed3\u7b97\u663e\u793a\u76ee\u524d\u6240\u9009\u7684cid\uff0c\u4ee5\u4f9b\u63d0\u4ea4\u5230\u7f51\u7edc\uff0c\u5546\u54c1\u6570\u91cf\u5e94\u8be5\u662f\u5305\u62ec\u5728cid\u4e2d\u7684\uff0c\u540e\u7aef\u8bbe\u8ba1\u5e94\u8be5\u53ea\u5173\u6ce8cid\u4e0euid<\/p><p>\u5e03\u5c40\u6587\u4ef6\u4e5f\u57cb\u4e00\u4e0btoast\uff0cjs\u53ea\u8981\u6539\u53d8toast\u7684\u663e\u793a\u4e0e\u5426\u5373\u53ef\u3002<\/p><p class=\"jb51code\"><br><\/p><pre class=\"brush:xml;\"><toast>\r\n  {{toastStr}}\r\n<\/toast><\/pre>\n
 \u767b\u5f55\u540e\u590d\u5236 <\/p>\n
\u4e3a\u7acb\u5373\u7ed3\u7b97\u7ed1\u5b9a\u4e8b\u4ef6bindCheckout\uff0c\u5f39\u51facid\u5f39\u7a97<\/p>\n
<\/p>\n
 bindCheckout: function() {\r\n    \/\/ \u521d\u59cb\u5316toastStr\u5b57\u7b26\u4e32\r\n    var toastStr = 'cid:';\r\n    \/\/ \u904d\u5386\u53d6\u51fa\u5df2\u52fe\u9009\u7684cid\r\n    for (var i = 0; i <p>1.5 \u5e95\u90e8\u60ac\u6d6e\u56fa\u5b9a<\/p><p>1.5.1 \u5546\u54c1\u5217\u8868 .carts-list \u52a0\u5165 <a href=\"http:\/\/www.php.cn\/wiki\/935.html\" target=\"_blank\">margin-bottom<\/a>: 80rpx; \u4ee5\u53ca\u4fee\u6539\u4e0a\u8fb9\u8ddd\u4e3a\u96f6\uff0c\u4f7f\u5f97\u5e95\u90e8\u90e8\u4ef6\u4e0e\u5206\u9694\u4e0d\u91cd\u590d\u51fa\u73b0\uff0cpadding: 0 40rpx;<\/p><p>1.5.2 \u5e95\u90e8\u6309\u94ae .carts-footer \u52a0\u5165 background: white;<\/p><p>1.5.3 .carts-footer \u52a0\u5165<\/p><p class=\"jb51code\"><br><\/p><pre class=\"brush:js;\">  position: fixed;\r\n  bottom: 0;\r\n  border-top: 1px solid #eee;<\/pre>\n
 \u767b\u5f55\u540e\u590d\u5236 <\/p>\n
\"\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u5f00\u53d1\u8d2d\u7269\u8f66\u7684\u5b9e\u4f8b\u4ee3\u7801\u63d2\u56fe2\"<\/p>\n
1.6 \u6c47\u603b<\/p>\n
1.6.1 \u9996\u5148\u5b9a\u4e49\u4e00\u4e2a\u6570\u636e\u6e90\uff0c\u5e76\u5728\u5e03\u5c40\u6587\u4ef6\u4e2d\u57cb\u5751<\/p>\n
total: ”<\/p>\n
 {{total}} <\/p>\n
1.6.2 \u901a\u7528\u6c47\u603b<\/p>\n
<\/p>\n
sum: function() {\r\n    var carts = this.data.carts;\r\n    \/\/ \u8ba1\u7b97\u603b\u91d1\u989d\r\n    var total = 0;\r\n    for (var i = 0; i <p>\u7136\u540e\u5206\u522b\u5728bindMinus bindPlus bindCheckbox bindSelectAll <a href=\"http:\/\/www.php.cn\/wiki\/1467.html\" target=\"_blank\">onLoad<\/a>\u4e2d\u8c03\u7528this.sum()<\/p><p>\u5982\u56fe\uff1a<\/p><p><img src=\"https:\/\/img.php.cn\/upload\/article\/000\/000\/013\/3184802caaca3e2d11bfcf371e9b0af9-5.png\" alt=\"\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u5f00\u53d1\u8d2d\u7269\u8f66\u7b80\u5355\u5b9e\u4f8b\u4ee3\u7801\"    style=\"max-width:90%\"  style=\"max-width:90%\" title=\"\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u5f00\u53d1\u8d2d\u7269\u8f66\u7b80\u5355\u5b9e\u4f8b\u4ee3\u7801\"><\/p><p>\u611f\u8c22\u9605\u8bfb\uff0c\u5e0c\u671b\u80fd\u5e2e\u52a9\u5230\u5927\u5bb6\uff0c\u8c22\u8c22\u5927\u5bb6\u5bf9\u672c\u7ad9\u7684\u652f\u6301\uff01<\/p><\/pre>\n
 \u767b\u5f55\u540e\u590d\u5236 <\/p>\n
\u4ee5\u4e0a\u5c31\u662f\u5fae\u4fe1\u5c0f\u7a0b\u5e8f\u5f00\u53d1\u8d2d\u7269\u8f66\u7684\u5b9e\u4f8b\u4ee3\u7801\u7684\u8be6\u7ec6\u5185\u5bb9\uff0c\u66f4\u591a\u8bf7\u5173\u6ce8\u7c73\u4e91\u5176\u5b83\u76f8\u5173\u6587\u7ae0\uff01<\/p>\n","protected":false},"excerpt":{"rendered":"
\u8fd9\u7bc7\u6587\u7ae0\u4e3b\u8981\u4ecb\u7ecd\u4e86\u5fae\u4fe1\u5c0f\u7a0b\u5e8f \u8d2d\u7269\u8f66\u7b80\u5355\u5b9e\u4f8b\u7684\u76f8\u5173\u8d44\u6599,\u9700\u8981\u7684\u670b\u53cb\u53ef\u4ee5\u53c2\u8003\u4e0b \u5fae\u4fe1\u5c0f\u7a0b\u5e8f\uff0c\u8fd9\u91cc\u5b9e\u73b0\u8d2d\u7269\u8f66\u529f\u80fd\u7684\u5c0fdemo,\u6709\u9700\u8981\u6b64\u529f\u80fd\u7684\u670b\u53cb\u53ef\u4ee5\u53c2\u8003\u4e0b\u3002 : \u52a0\u51cf\u5546\u54c1\u6570\u91cf\uff0c\u6c47\u603b\u4ef7\u683c\uff0c\u5168\u9009\u4e0e\u5168\u4e0d\u9009 \u8bbe\u8ba1\u601d\u8def\uff1a \u4e00\u3001\u4ece\u7f51\u7edc\u5165\u4ee5\u4e0b\u6570\u636e\u683c\u5f0f\u7684 1.\u8d2d\u7269\u8f66id\uff1acid 2.\u6807\u9898title 3.\u6570\u91cfnum 4.\u5730\u5740 5.\u4ef7\u683cprice 6.\u5c0f\u8ba1 7.\u662f\u5426\u9009\u4e2dselected \u4e8c\u3001\u70b9\u51fbtoggle\u64cd\u4f5c \u5982\u5df2\u7ecf\u9009\u4e2d\u7684\uff0c\u7ecf\u70b9\u51fb\u53d8\u6210\u672a\u9009\u4e2d\uff0c\u53cd\u4e4b\u800c\u53cd\u4e4b \u70b9\u51fb\u4f9d\u636eindex\u4f5c\u4e3a\u6807\u8bc6\uff0c\u800c\u4e0d\u7528cid\uff0c\u65b9\u4fbf\u904d\u5386 \u4e09\u3001\u5168\u9009\u64cd\u4f5c \u9996\u6b21\u70b9\u51fb\u5373\u4e3a\u5168\u90e8\u9009\u4e2d\uff0c\u518d\u6b21\u70b9\u51fb\u4e3a\u5168\u4e0d\u9009\uff0c\u5168\u9009\u672c\u8eab\u4e5f\u8ddf\u968ftoggle\u53d8\u6362 \u56db\u3001\u70b9\u51fb\u7ed3\u7b97\u6309\u94ae\uff0c\u5c06\u5df2\u9009\u4e2d\u7684cid\u6570\u7ec4\u53d6\u51fa\uff0c\u4ee5\u4f9b\u901a\u8fc7\u7f51\u7edc\u63d0\u4ea4\u5230\u670d\u52a1\u7aef\uff0c\u8fd9\u91cc\u7ed9\u4e2atoast\u4f5c\u4e3a\u7ed3\u679c\u6f14\u793a\u3002 \u4e94\u3001\u5229\u7528stepper\u4f5c\u52a0\u51cf\u8fd0\u7b97\uff0c\u540c\u6837\u4f9d\u636eindex\u4f5c\u4e3a\u6807\u8bc6\uff0c\u70b9\u5b8c\u5199\u56denum\u503c\u3002 \u516d\u3001\u5e03\u5c40\uff0c\u5168\u9009\u4e0e\u7ed3\u7b97\u6309\u94ae\u5e95\u90e8\u5bf9\u9f50\uff0c\u8d2d\u7269\u8f66\u5546\u57ce\u81ea\u9002\u5e94\u9ad8\u5ea6\uff0c\u7c7b\u4f3c\u4e8e\u7684weight\u3002 \u6b65\u9aa4\uff1a \u521d\u59cb\u6570\u636e\u6e32\u67d3 1.1 \u5e03\u5c40\u4e0e\u6837\u5f0f\u8868 \u4e0a\u65b9\u662f\u4e00\u4e2a\u5546\u54c1\u5217\u8868\uff0c\u4e0b\u65b9\u662f\u4e00\u4e2a\u5168\u9009\u6309\u94ae\u4e0e\u7acb\u5373\u7ed3\u7b97\u6309\u94ae \u5546\u54c1\u5217\u8868\u5de6\u90e8\u4e3a\u5546\u54c1\uff0c\u53f3\u4e0a\u4e3a\u5546\u54c1\u6807\u9898\uff0c\u53f3\u4e0b\u4e3a\u5546\u54c1\u4ef7\u683c\u4e0e\u6570\u91cf\uff0c\u5176\u4e2d\u5546\u54c1\u6570\u91cf\u4f7f\u7528WXStepper\u6765\u5b9e\u73b0\u52a0\u51cf\u64cd\u4f5c js\uff1a\u521d\u59cb\u5316\u4e00\u4e2a\u6570\u636e\u6e90\uff0c\u8fd9\u5f80\u5f80\u662f\u4ece\u7f51\u7edc\u83b7\u53d6\u7684\uff0c\u76f8\u5173\u53ef\u53c2\u89c1\uff1ahttp:\/\/www.php.cn\/ Page({   data:{     carts: [       {cid:1008,title:’Zippo\u6253\u706b\u673a’,image:’https:\/\/img12.360buyimg.com\/n7\/jfs\/t2584\/348\/1423193442\/572601\/ae464607\/573d5eb3N45589898.jpg’,num:’1′,price:’198.0′,sum:’198.0′,selected:true},       {cid:1012,title:’iPhone7 Plus’,image:’https:\/\/img13.360buyimg.com\/n7\/jfs\/t3235\/100\/1618018440\/139400\/44fd706e\/57d11c33N5cd57490.jpg’,num:’1′,price:’7188.0′,sum:’7188.0′,selected:true},       {cid:1031,title:’\u5f97\u529b\u8ba2\u4e66\u673a’,image:’https:\/\/img10.360buyimg.com\/n7\/jfs\/t2005\/172\/380624319\/93846\/b51b5345\/5604bc5eN956aa615.jpg’,num:’3′,price:’15.0′,sum:’45.0′,selected:false},       {cid:1054,title:’\u5eb7\u5e08\u5085\u5999\u8299\u86cb\u7cd5’,image:’https:\/\/img14.360buyimg.com\/n7\/jfs\/t2614\/323\/914471624\/300618\/d60b89b6\/572af106Nea021684.jpg’,num:’2′,price:’15.2′,sum:’30.4′,selected:false},       {cid:1063,title:’\u82f1\u96c4\u94a2\u7b14’,image:’https:\/\/img10.360buyimg.com\/n7\/jfs\/t1636\/60\/1264801432\/53355\/bb6a3fd1\/55c180ddNbe50ad4a.jpg’,num:’1′,price:’122.0′,sum:’122.0′,selected:true},     ]   } }) \u767b\u5f55\u540e\u590d\u5236 \u5e03\u5c40\u6587\u4ef6 <view>   <view>     <view>      <image><\/image>     <\/view>    <view>     <text>{{item.title}}<\/text>     <view>      <text>{{item.sum}}<\/text>      <text>WXStepper<\/text>     <\/view>    <\/view>   <\/view><\/view> […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[19],"tags":[],"class_list":["post-29003","post","type-post","status-publish","format-standard","hentry","category-19"],"_links":{"self":[{"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/posts\/29003","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/comments?post=29003"}],"version-history":[{"count":0,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/posts\/29003\/revisions"}],"wp:attachment":[{"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/media?parent=29003"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/categories?post=29003"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fwq.ai\/blog\/wp-json\/wp\/v2\/tags?post=29003"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}