頁面

 <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)
    }
  })
}