vue3.0 refs,vuerefs详解

　　一般直接操作DOM在Vue中很少使用，但有时需要使用是必然的。这时候我们可以通过ref和$refs来实现。以下文章主要介绍vue3中$refs的基本用法，有需要的朋友可以参考一下。

　　1.你可以在vue2中通过这个访问来索取$refs，但是在vue3中是无法获得的，因为你没有这个，但是官网提供了获得的方法。

　　知道怎么弄的，就和ElementPlus结合使用，因为项目里用了ElementPlus的表单验证，官网也是醉了，写了vue2。

　　话不多说，上代码

　　由于我得form表单外面包了一层el-dialog，是不能在onMounted中获取到$refs的，应该在触发对应事件，让dialog绑定的v-model变为true的获取获取

　　标签位置=左

　　标签宽度= 120像素

　　:model=form

　　:append-to-body=true

　　:fullscreen=true

　　:rules=rules

　　ref=ruleForm

　　El-form-item label=旧密码 prop=oldPwd

　　El-input v-model= form . old pwd placeholder=请输入新密码/el-input

　　/El-表单-项目

　　/el格式

　　脚本

　　从“vue”导入{ ref}

　　导出默认值{

　　setup() {

　　const ruleForm=ref(null)

　　//提交修改后的密码

　　const submitForm=()={

　　console.log(ruleForm.value)

　　rule form . value . validate(valid={

　　如果(有效){

　　console.log(1111)

　　}否则{

　　console.log(222)

　　}

　　})

　　}

　　}

　　}

　　/脚本

　　这时候你就可以得到他下面的validate方法了。

　　第二种方法，也可以通过getCurrentInstance

　　您可以通过在控制台上输出这个方法来查看它。

　　总结

　　关于vue3中$refs的基本用法的这篇文章到此为止。关于vue3中$refs用法的更多信息，请搜索我们以前的文章或继续浏览下面的相关文章。希望你以后能支持我们！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。