vue3中的v-model怎么用

最新推荐文章于 2024-08-19 15:53:46 发布

做一只快乐的咸鱼

最新推荐文章于 2024-08-19 15:53:46 发布

阅读量372

点赞数

文章标签： javascript vue.js 前端

本文链接：https://blog.csdn.net/melissaomy/article/details/129310891

版权

在父组件使用子组件的地方正常写

<content  v-model="isClose" ></content>

子组件有两个以下的注意点

<template>
  <div class="header">
    <el-icon  v-if="modelValue" @click="toggle"><Expand /></el-icon>
    <el-icon v-else  @click="toggle"><Fold /></el-icon>
  </div>
  <div class="wrapper">
    <router-view></router-view>
  </div>
</template>

<script setup>
const props =defineProps({
  modelValue:{  //1、子组件固定用modelValue接收
    type:Boolean,
    default:false
  }
})
const emits =defineEmits(['update:modelValue']) //emits的方法固定是'update:modelValue'
const toggle =()=>{
  emits('update:modelValue',!props.modelValue)
}
</script>