微信小程序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>
相关推荐
Cobyte7 小时前
1.基于依赖追踪和触发的响应式系统的本质
前端·javascript·vue.js
计算机学姐8 小时前
基于SpringBoot的咖啡店管理系统【个性化推荐+数据可视化统计+配送信息】
java·vue.js·spring boot·后端·mysql·信息可视化·tomcat
web守墓人8 小时前
【前端】记一次将ruoyi vue3 element-plus迁移到arco design vue的经历
前端·vue.js·arco design
SuperEugene9 小时前
Element Plus/VXE-Table UI 组件库规范:统一用法实战,避开样式冲突与维护混乱|工程化与协作规范篇
前端·javascript·vue.js·ui·前端框架·element plus·vxetable
AnalogElectronic9 小时前
uniapp学习5,兼容微信小程序的俄罗斯方块游戏
学习·微信小程序·uni-app
网络点点滴10 小时前
Vue3中Suspense的使用
前端·javascript·vue.js
FollowHeart11 小时前
自建私有日记本:MyDiary —— 属于你的 NAS 极简写作空间
vue.js·github
angerdream11 小时前
最新版vue3+TypeScript开发入门到实战教程之组件通信之二
javascript·vue.js
名字很费劲11 小时前
vue项目,刷新后出现404错误,怎么解决
前端·javascript·vue·404
码界筑梦坊12 小时前
329-基于Python的交通流量数据可视化分析系统
开发语言·python·信息可视化·数据分析·django·vue·毕业设计