微信小程序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>
相关推荐
云水一下19 分钟前
Vue.js从零到精通系列(三):组件化基础——Props、Emits、插槽与生命周期
前端·javascript·vue.js
kidding7231 小时前
高效备忘清单工具类小程序
前端·计算机网络·微信小程序·小程序
英勇无比的消炎药2 小时前
少踩坑TinyVue插槽事件编码规范详解
vue.js
2401_868534783 小时前
5G和4G接入网对比介绍
vue.js
前端 贾公子4 小时前
小程序蓝牙打印探索与实践 (最终章)
前端·微信小程序·小程序
chushiyunen4 小时前
vue export default
前端·javascript·vue.js
北极星日淘5 小时前
可买免税店货物与安耐晒——特殊商品代购技术方案
javascript·vue.js·elementui
youyu-youyu5 小时前
oss阿里云图片链接url高清图片设置为缩略图 vue 减少加载体积流量
前端·javascript·vue.js·阿里云·云计算
低保和光头哪个先来5 小时前
聊聊 CSS 编译和 scoped 实现
前端·css·vue.js
小羊Yveesss6 小时前
2026年个人能做微信小程序吗?
微信小程序·小程序