美文网首页
关于在一个Vue中方法的相互调用、组件调用

关于在一个Vue中方法的相互调用、组件调用

作者: 都江堰古巨基 | 来源:发表于2018-10-24 16:26 被阅读0次

    今天在Vue中遇到了方法相互调用的坑,特此来备注一下:

    // 一个用Vue-cli搭建的工程:
    export default {
      name:"xxx",
      data(){
        ......
      }
      methods:{
        methodA(xxx){
          ......
        },
        methodB(){
          ......
          # 在B中调用A:
          this.methodA(xxx)
        },
      }
    }
    

    在Vue中(vue-cli)使用一个自己写的组件在另一个.vue文件中的办法:

    // SoFaButton .vue:
    <template>
        <span id="mybutton">
            <el-button type="primary" size="mini">
                <a v-bind:href="myUrl">{{myMessage}}</a>
            </el-button>
        </span>
    </template>
    
    <script>
        export default{
            name:"mybutton",
            props:['myUrl','myMessage']
        }
    </script>
    
    <style scoped>
        button > span > a {
            text-decoration: none;
            font-family: "PingFang SC";
            color: #ffff
        }
    </style>
    
    // 调用:
    // <template>中:
    
    <SoFaButton 
      myUrl="/manager"
      myMessage="点我查看未添加站点">    
    </SoFaButton>
    
    #<script>中:
    import SoFaButton from '@/components/SoFaButton'
    
    components: {
      SoFaButton,
     },
    

    相关文章

      网友评论

          本文标题:关于在一个Vue中方法的相互调用、组件调用

          本文链接:https://www.haomeiwen.com/subject/cvuuhftx.html