今天在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,
},