微信小程序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>
相关推荐
by__csdn9 小时前
Vue3 setup()函数终极攻略:从入门到精通
开发语言·前端·javascript·vue.js·性能优化·typescript·ecmascript
一条可有可无的咸鱼10 小时前
企业招聘信息,企业资讯进行公示
java·vue.js·spring boot·uni-app
lionliu051910 小时前
js的扩展运算符的理解
前端·javascript·vue.js
老前端的功夫12 小时前
Vue 3 vs Vue 2 深度解析:从架构革新到开发体验全面升级
前端·vue.js·架构
狗哥哥13 小时前
Vue 3 动态菜单渲染优化实战:从白屏到“零延迟”体验
前端·vue.js
青青很轻_13 小时前
Vue自定义拖拽指令架构解析:从零到一实现元素自由拖拽
前端·javascript·vue.js
阿里巴巴AI编程社区13 小时前
用Qoder打造自己的AI工作台,普通人也可10倍提效!
微信小程序
蜗牛攻城狮13 小时前
Vue 中 `scoped` 样式的实现原理详解
前端·javascript·vue.js
q_191328469514 小时前
基于SpringBoot2+Vue2的行业知识答题考试系统
java·vue.js·spring boot·mysql·毕业设计·计算机毕业设计·演示文稿
方安乐15 小时前
vue3 el-select懒加载以及自定义指令
javascript·vue.js·elementui