标签：uniapp mylist name provide var vue3 msg newValue 传值

<!-- 子组件名 comchild-->
<template>
<view class="content">
<text>{{msg}}</text>
<block v-for="(item,index) in mylist" :key="item.id">
<view class="">{{item.name}}</view>
</block>
<input type="text" v-model="inmsg" />
</view>
</template>
<script setup>
import {
watch,
ref,
inject
} from 'vue'
var msg = inject("msg");
var mylist = inject("mylist");
var f_f = inject("f_f");
var inmsg = ref('这是子传给父 初始值')

watch(inmsg, (newValue, oldValue) => {
f_f(newValue)
console.log(newValue)
})
</script>
<style>
.content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background: #007AFF;
height: 400upx;
}
</style>

<!-- 父组件 -->
<!-- manifest.json 设置Vue3 -->
<template>
<view class="content">
<comchild></comchild>
<input type="text" v-model="msg" />
</view>
</template>

<script setup>
import {watch, ref,reactive, provide } from 'vue'
// 父传给子
var msg=ref('这是父传给子 初始值');
provide("msg",msg)
watch(msg,(newValue,oldValue)=>{
mylist[0].name=newValue
mylist[1].name=oldValue

console.log(newValue)
})

// 子传给父
var f_f=(value)=>{
msg.value=value
console.log(value)
}
provide("f_f",f_f)
var mylist=reactive([
{id:1,name:"xx1"},
{id:2,name:"xx2"},
{id:2,name:"xx3"}
])
provide("mylist",mylist)
</script>

<style>
.content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
</style>

标签：uniapp,mylist,name,provide,var,vue3,msg,newValue,传值
来源： https://www.cnblogs.com/xcwei32/p/15915362.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。