vue3+element-plus props中的变量使用 v-model 报错及解决方案
更新时间:2023年10月16日 10:51:54 作者:Yriaf@2022
这篇文章主要介绍了vue3+element-plus props中的变量使用 v-model 报错及解决方案,prop 是单向数据流,这里只能用:model-value,不能用v-model,本文给大家介绍的非常详细,需要的朋友可以参考下
vue3+element-plus props中的变量使用 v-model 报错
<template> <el-button @click="handleClick" type="primary"> <slot></slot> </el-button> <el-dialog :title="title" v-model="visiable">111</el-dialog> </template> <script lang="ts" setup> import {watch} from 'vue' let props = defineProps<{ // 弹出框的标题 title: string, // 控制弹出框的显示与隐藏 visiable: boolean }>(); let emits = defineEmits(['update:visiable']) let handleClick = () => { emits('update:visiable',!props.visiable) }; // 监听visible的变化 watch(() =>props.visiable,val => { emits('update:visiable',val) console.log(val) }) </script> <style> </style>
在el-dialog组件上的v-model绑定的值是props中父组件传过来的,报以下错误:
解决方案:
prop 是单向数据流,这里只能用:model-value,不能用v-model
到此这篇关于vue3+element-plus props中的变量使用 v-model 报错及解决方案的文章就介绍到这了,更多相关vue3+element-plus使用 v-model 报错内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
相关文章
element-plus按需引入后ElMessage与ElLoading在页面中的使用
这篇文章主要介绍了element-plus按需引入后ElMessage与ElLoading在页面中的使用方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教2022-09-09详解如何在Vue3+TS的项目中使用NProgress进度条
本文主要介绍了详解如何在Vue3+TS的项目中使用NProgress进度条,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧2022-06-06
最新评论