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

今天在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,
 },
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容