微信小程序vue3父组件调用vue2子组件传多个参数方法

vue3父组件调用vue2子组件传参数

1. vue3父组件

javascript 复制代码
<template>
  <div>
    <child :message="message" />
    <button @click="test">添加车牌号</button>
  </div>
</template>
 
<script setup>
import { ref, onMounted } from 'vue';
import Child from './Child.vue'; // 确保路径正确
  const id = ref(0);
  const message = ref('');
    
  const test = () => {
        id.value = 1;
		message.value = "皮卡";
	};
</script>

2. vue2子组件`

javascript 复制代码
<template>
 <div>{{ message }}</div>
</template>

<script>
export default {
 props: ['id','message'],
 	data() {
   		return {
   			message: ''
   			}
   		},
            
   mounted() {
   			this.message = this.$props.message;	
   		
   	}
   	}
</script>
相关推荐
沈梦研2 小时前
【Vscode】Vscode不能执行vue脚本的原因及解决方法
ide·vue.js·vscode
轻口味2 小时前
Vue.js 组件之间的通信模式
vue.js
寰宇软件4 小时前
PHP CRM售后系统小程序
微信小程序·小程序·vue·php·uniapp
fmdpenny5 小时前
Vue3初学之商品的增,删,改功能
开发语言·javascript·vue.js
涔溪5 小时前
有哪些常见的 Vue 错误?
前端·javascript·vue.js
亦黑迷失8 小时前
vue 项目优化之函数式组件
前端·vue.js·性能优化
计算机-秋大田8 小时前
基于SpringBoot的高校教师科研的设计与实现(源码+SQL脚本+LW+部署讲解等)
java·vue.js·spring boot·后端·课程设计
eason_fan8 小时前
分析vue3源码23(异步组件实现)
vue.js·前端框架·源码阅读
浩宇软件开发10 小时前
微信小程序实现自定义日历功能
微信小程序·小程序
Q_274378510910 小时前
springboot基于微信小程序的健康管理系统
spring boot·后端·微信小程序