zoukankan      html  css  js  c++  java
  • vue单引js写组件的总结

    html部分正常写 调用组件时

    //写在body里面
    <withdrawal-hongbao v-if="flagHongbao" :hongbao="hongbao"></withdrawal-hongbao>

    //template 要写在body外面
    
    <template id="withdrawal-notice" style="display: none;">
        <div id="hongbao-main">
            <div class="hongbao-con">
                <div id="hongbao-click" @click="goUrl()" data-url="{{hongbao.dataurl}}"></div>
                <div id="hongbao-close" @click="goClose()"></div>
            </div>
        </div>
    </template>

    JS部分

    class Withdrawal {
      constructor() {
        this.init();
      }
      init() {
            let components = this.vueComponents();
    
            this.$vm = new Vue({
                el: ".wrapper",
                data: {
                       hongbao:{
                          url:"",    
                          sumAmt:"",    
                    },
                    flagHongbao:false,
                   },
                methods: {
                    hongBao: function() {//你的逻辑}     
                },
                components: components,
                })
      vueComponents() {
        let self = this;
    return { withdrawalHongbao:self.getwithdrawalhongbao() }; } getwithdrawalhongbao(){ return Vue.extend({ template: "#withdrawal_hongbao", props: ["hongbao","flagHongbao"], methods:{ goClose(){ this.flagHongbao = false; document.getElementById("hongbao-main").style.display = "none"; }, goUrl(){} } }); } } $(function() { new Withdrawal(); })


      

  • 相关阅读:
    CentOS 7.3 CDH 5.10.0 Druid0.12.4安装记录
    cloudera manager卸载流程
    CDH5.10.0 离线安装(共3节点) 转
    CentOS 7 安装Httpd(转)
    CentOS下MySQL的彻底卸载
    CentOS7 修改主机名
    sendEvent()
    QSignalMapper Class
    ubuntu12.04开启虚拟机的unity模式
    BCM_I2C函数更改
  • 原文地址:https://www.cnblogs.com/yangsg/p/12766636.html
Copyright © 2011-2022 走看看