北京网站设计策划公司,wordpress物体替换纹理,网站内链布局,怎么制作网站?目录
一、vue3的defineModel介绍
二、defineModel使用
#xff08;1#xff09;在vite.config.js中开启
#xff08;2#xff09;子组件
#xff08;3#xff09;父组件 一、vue3的defineModel介绍 为什么要使用到defineModel呢#xff1f;这里有这样一种场景…
目录
一、vue3的defineModel介绍
二、defineModel使用
1在vite.config.js中开启
2子组件
3父组件 一、vue3的defineModel介绍 为什么要使用到defineModel呢这里有这样一种场景 子组件传递给父组件数据并且实时更改。那么我们知道大概思路就是子组件使用defineEmits和defineProps来但是这样很复杂代码很多重复实时更换让我们想到了v-model所以我们就需要用到defineModel了。具体操作如下 子组件的输入框数据变化父组件也同样显示。 二、defineModel使用
1在vite.config.js中开启 2子组件 templatediv classsonh3子组件/h3input typetext inputecountvaluee.target.value :valuecountvalue /div
/templatescript setup
import {defineModel} from vue
const countvaluedefineModel()/scriptstyle
.son{border: 1px solid red;width: 200px;height: 200px;
}
/style 3父组件 templatediv classfah3父组件/h3Son v-modelcount/Soncount{{ count }}/div
/templatescript setup
import Son from ./Son.vue;
import {ref} from vueconst countref(123445)
/scriptstyle
.fa{border: 1px solid black;width: 300px;height: 300px;
}
/style
