vant4不提交表单，按钮触发校验

可以通过以下步骤实现vant4点击按钮触发校验但不提交表单：

1. 在模板中使用van-form组件包裹表单内容，并设置ref属性。

2. 在表单项中使用van-field组件，并设置prop属性。

3. 在van-form组件中设置rules属性，用于定义表单项的校验规则。

4. 在按钮上使用@click事件监听器，并在事件处理函数中调用this.$refs.form.validate()方法，触发表单校验。

5. 在事件处理函数中判断表单校验结果，如果校验通过则可以执行其他操作。

下面是一个简单的示例代码：

<template>
  <van-form ref="form" :rules="rules">
    <van-field v-model="name" label="姓名" prop="name" />
    <van-field v-model="email" label="邮箱" prop="email" />
    <van-button type="primary" @click="validateForm">校验</van-button>
  </van-form>
</template>

<script>
export default {
  data() {
    return {
      name: '',
      email: '',
      rules: {
        name: [
          { required: true, message: '请填写姓名', trigger: 'blur' },
          { min: 2, max: 10, message: '姓名长度在 2 到 10 个字符', trigger: 'blur' }
        ],
        email: [
          { required: true, message: '请填写邮箱', trigger: 'blur' },
          { type: 'email', message: '邮箱格式不正确', trigger: 'blur' }
        ]
      }
    }
  },
  methods: {
    validateForm() {
      this.$refs.form.validate(valid => {
        if (valid) {
          // 表单校验通过，可以执行其他操作
          console.log('表单校验通过')
        } else {
          // 表单校验不通过，需要处理错误信息
          console.log('表单校验不通过')
        }
      })
    }
  }
}
</script>

在这个示例中，当用户点击“校验”按钮时，会触发validateForm方法，在这个方法中调用form的validate方法进行表单校验。如果校验通过，则会在控制台输出“表单校验通过”；如果校验不通过，则会输出“表单校验不通过”。需要注意的是，这里并没有使用submit按钮提交表单，而是使用一个普通的按钮触发校验。