uniapp 用vue事件方法注册调用

事件注册

首先：在组件中 写一个button

然后写一下这个事件的方法：

在主页面中 调用这个事件

打印输出看一下这个事件 是否调用成功

组件代码：

<template>
	<view>
		<text>  {{msg}}</text>
		<!--  传参事件 -->
		<button type="primary" @click="test">复制</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			};
		},
		props:["msg"],
		/* 定义事件方法 */
		methods:{
			test(){
				this.$emit("action",{name:"复制成功"})
			}
		}
	}
</script>

<style lang="scss">

</style>

页面代码：

<template>
	<view class="content">
		<!-- 接收参数 -->
		<test :msg="msg" @action="testEvent"></test>
	</view>
</template>

<script>
import test from "../../../components/test.vue" 
export default{
	data(){
		return{
			msg:'动态传参'
		}
	 },
		components: {
		test
		},
		onLoad() {
			
		},
		methods: {
			testEvent(e){
				console.log(e)
			}		
	}
}
</script>

<style >
	.content{
		display: flex;
		color: #0054EA;
		font-size: 25px;
		align-content: center;
		justify-content: center;
	}
</style>

第二种 用uniapp api全局事件订阅 调用

定义的方法改成 uni 事件调用

uni 自带的api事件，

仅供参考，vue学习笔记。