请实现一个弹出对话框组件, 如下图(可以使用vue, jqu

[问答题]

请实现一个弹出对话框组件, 如下图(可以使用vue, jquery, react等框架)

我是闷葫芦啊

Vue.component('alert-box',{
    template:`<div>
                <div v-if="active">
                    <h2>{{ tit }}</h2>
                    <p>{{ main }}</p>
                </div>
                <ul>
                   <li @click="handleNo">取消</li>
                   <li @click="handleOk">确定</li>
                </ul>
             </div>`,
    props:{
        tit:String,
        main:String
    },
    data:function(){
         return {
             active:true    
          }
    },
    methode:{
       handleOk:function(){
           this.active = false;
       },
       handleNo:function(){
            this.active = false;
       }
    }

})

编辑于 2019-04-14 18:12:09 回复(2)

curry300000000000

<!DOCTYPE html>
<html>
<head>     <title></title>     <style type="text/css">         /*ddd*/         .bg{             height: 200px;             width: 360px;             text-align: center;             margin: 300px auto;             background-color: white;             border-radius: 5px;         }         .hello{             font-size: 25px;             text-align: center;             padding: 20px;         }         .modal{             color: gray;             font-size: 18px;             padding: 15px 0 25px 0;             text-align: center;         }         .bt{             width: 280px;             margin: auto;             padding-top: 18px;             font-size: 22px;         }         .qx{             width: 110px;             cursor: pointer;             text-align: left;             display: inline-block;         }         .qd{             width: 110px;             color: green;             text-align: right;             cursor: pointer;             display: inline-block;         }     </style>
</head>
<body bgcolor="black">     <div class="bg">                  <div class="hello">hello</div>         <div class="modal">this is a modal</div>             <div class="bt">             <div class="qx">取消</div>             <div class="qd">确定</div>         </div>         </div>
</body>
</html>

发表于 2019-04-07 13:46:44 回复(0)

提交观点

问题信息

安卓工程师前端工程师 2019 蘑菇街

来自：蘑菇街2019届校招-...

上传者：小小

难度：

2条回答 77收藏 3328浏览

请实现一个弹出对话框组件, 如下图(可以使用vue, jqu

问题信息

热门推荐

相关试题