微信小程序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>
相关推荐
Trae1ounG32 分钟前
Vue Iframe
前端·javascript·vue.js
爱上妖精的尾巴1 小时前
8-1 WPS JS宏 String.raw等关于字符串的3种引用方式
前端·javascript·vue.js·wps·js宏·jsa
东东5161 小时前
xxx食堂移动预约点餐系统 (springboot+微信小程序)
spring boot·微信小程序·小程序·毕业设计·个人开发·毕设
web打印社区1 小时前
vue页面打印:printjs实现与进阶方案推荐
前端·javascript·vue.js·electron·html
daols882 小时前
vue2 甘特图 vxe-gantt 一行渲染多个子任务的配置
vue.js·甘特图·vxe-table
码界奇点2 小时前
基于Spring Boot和Vue3的无头内容管理系统设计与实现
java·spring boot·后端·vue·毕业设计·源代码管理
pas1364 小时前
39-mini-vue 实现解析 text 功能
前端·javascript·vue.js
qq_532453534 小时前
使用 GaussianSplats3D 在 Vue 3 中构建交互式 3D 高斯点云查看器
前端·vue.js·3d
东东5165 小时前
基于Web的智慧城市实验室系统设计与实现vue + ssm
java·前端·人工智能·后端·vue·毕业设计·智慧城市
陶甜也5 小时前
Vue.js 多项目同端口部署实战:上下文路径配置指南
前端·javascript·vue.js·nginx