vue3 通过ref 找到 dom实例
页面
<el-tab-pane label="用户名登录">
<el-form
:model="form"
label-position="right"
label-width="70px"
style="max-width: 460px"
class="loginForm"
:rules="form_rules"
ref="formRef"
>
<el-form-item label="用户名:" prop="username">
<el-input v-model="form.username"/>
</el-form-item>
<el-form-item label="密码:" prop="password">
<el-input type="password" v-model="form.password"/>
</el-form-item>
<el-row>
<el-checkbox
class="checkBox"
v-model="phoneForm.isAgree"
label="同意用户使用准则"
name="type"
/>
</el-row>
<el-button
v-if="phoneForm.isAgree"
type="primary"
class="loginBtn"
@click="login"
>
登录
</el-button>
</el-form>
</el-tab-pane>
操作
import {getCurrentInstance} from "vue";
const {proxy} = getCurrentInstance()
// 登录
function login() {
proxy.$refs.formRef.validate((valid, fields) => {
if (valid) {
console.log(form);
} else {
console.log('error submit!', fields)
}
})
}
本文作者:Sherwin
本文链接:https://www.cnblogs.com/sherwin1995/p/16939025.html
版权声明:本作品采用知识共享署名-非商业性使用-禁止演绎 2.5 中国大陆许可协议进行许可。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步