微信小程序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>
相关推荐
四岁爱上了她3 分钟前
input输入框焦点的获取和隐藏div,一个自定义的下拉选择
前端·javascript·vue.js
Jing_Rainbow27 分钟前
【 Weapp-1 /Lesson18(2025-11-03)】# 微信小程序开发全解析:从项目结构到生态优势 🚀
微信·微信小程序·程序员
千寻技术帮43 分钟前
50045_基于微信小程序的民宿预订管理系统
微信小程序·源码·ppt·项目文档·民宿
湖边看客2 小时前
antd x6 + vue3
开发语言·javascript·vue.js
禁止摆烂_才浅3 小时前
Taro 小程序页面返回传参完整示例
react.js·微信小程序·taro
Cassie燁3 小时前
element-plus源码解读1——useNamespace
前端·vue.js
Cassie燁4 小时前
el-button源码解读1——为什么组件最外层套的是Vue内置组件Component
前端·vue.js
北极糊的狐4 小时前
Vue3 子组件修改父组件传递的对象并同步的方法汇总
前端·javascript·vue.js
一 乐6 小时前
餐厅管理智能点餐系统|基于java+ Springboot的餐厅管理系统(源码+数据库+文档)
java·前端·数据库·vue.js·spring boot·后端
北极糊的狐6 小时前
父组件向子组件传参时,传递数组和对象类型的参数的方法
前端·javascript·vue.js