A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

5. 实现组件更新数据功能  下
  • 子组件通过一个标识符来标记对用的用户点击  + - 或者输入框输入的内容
  • 父组件拿到标识符更新对应的组件
  • [AppleScript] 纯文本查看 复制代码
    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <title>Document</title>
      <style type="text/css">
        .container {
        }
        .container .cart {
          width: 300px;
          margin: auto;
        }
        .container .title {
          background-color: lightblue;
          height: 40px;
          line-height: 40px;
          text-align: center;
          /*color: #fff;*/  
        }
        .container .total {
          background-color: #FFCE46;
          height: 50px;
          line-height: 50px;
          text-align: right;
        }
        .container .total button {
          margin: 0 10px;
          background-color: #DC4C40;
          height: 35px;
          width: 80px;
          border: 0;
        }
    [AppleScript] 纯文本查看 复制代码
     .container .total span {      color: red;
          font-weight: bold;
        }
        .container .item {
          height: 55px;
          line-height: 55px;
          position: relative;
          border-top: 1px solid #ADD8E6;
        }
        .container .item img {
          width: 45px;
          height: 45px;
          margin: 5px;
        }
        .container .item .name {
          position: absolute;
          width: 90px;
          top: 0;left: 55px;
          font-size: 16px;
        }
    
        .container .item .change {
          width: 100px;
          position: absolute;
          top: 0;
          right: 50px;
        }
        .container .item .change a {
          font-size: 20px;
          width: 30px;
          text-decoration:none;
          background-color: lightgray;
          vertical-align: middle;
        }
        .container .item .change .num {
          width: 40px;
          height: 25px;
        }
        .container .item .del {
          position: absolute;
          top: 0;
          right: 0px;
          width: 40px;
          text-align: center;
          font-size: 40px;
          cursor: pointer;
          color: red;
        }


0 个回复

您需要登录后才可以回帖 登录 | 加入黑马