微信小程序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>
相关推荐
涵涵(互关)6 小时前
Naive-ui树型选择器只显示根节点
前端·ui·vue
还有多久拿退休金10 小时前
我用 Three.js 造了个 3D 漫步世界,角色走路像喝醉了——以及我是怎么修好的
前端·vue.js
LJA6484410 小时前
为什么 AI 时代更需要配置化组件库
vue.js
jay神13 小时前
基于微信小程序课外创新实践学分认定系统
java·spring boot·小程序·vue·毕业设计
弹简特14 小时前
【Vue3速成】01-npm+vue初体验+vite构建vue工程化
vue.js·arcgis·npm
QuZhengRong15 小时前
【Luck-Report】缓存
java·前端·后端·vue·excel
摸鱼小李上线了15 小时前
vue项目页面添加水印实现方法
前端·javascript·vue.js
i220818 Faiz Ul16 小时前
智慧养老平台|基于SprinBoot+vue的智慧养老平台系统(源码+数据库+文档)
java·前端·数据库·vue.js·spring boot·毕设·智慧养老平台
Lkstar16 小时前
Pinia 进阶:Setup Store、插件系统与状态持久化,一篇全搞懂
前端·vue.js
Nikluas16 小时前
彻底搞懂 Vue 运行时的四大核心谜题:Render、Effect、Diff 算法与 Block Tree 演进
vue.js·面试