van-action-sheet 放在form表单中，选中后自动提交

解决方案：

增加 form 提交   

1. element-form @submit.native.prevent

   <el-form @submit.native.prevent>
       <van-button type="info" @click="showActionSheet">弹出菜单</van-button>
       <van-action-sheet v-model="show" :actions="actions" @select="onSelect" />
   </el-form>
   
   export default {
     data() {
       return {
         show: false,
         actions: [
           { name: '选项' },
           { name: '选项' },
           { name: '选项', subname: '描述信息' }
         ]
       };
     },
   
     methods: {
       showActionSheet(){
           this.show = true;
       },
       onSelect(item) {
         // 默认情况下，点击选项时不会自动关闭菜单
         // 可以通过 close-on-click-action 属性开启自动关闭
         this.show = false;
         Toast(item.name);
       }
     }
   }

    

2. form οnsubmit="return false;"

   <form action="" onsubmit="return false;">
       <van-button type="info" @click="showActionSheet">弹出菜单</van-button>
       <van-action-sheet v-model="show" :actions="actions" @select="onSelect" />
   </form>
   
   export default {
     data() {
       return {
         show: false,
         actions: [
           { name: '选项' },
           { name: '选项' },
           { name: '选项', subname: '描述信息' }
         ]
       };
     },
   
     methods: {
       showActionSheet(){
           this.show = true;
       },
       onSelect(item) {
         // 默认情况下，点击选项时不会自动关闭菜单
         // 可以通过 close-on-click-action 属性开启自动关闭
         this.show = false;
         Toast(item.name);
       }
     }
   }

    

原因：

van-action-sheet的选项渲染成button，button在除IE外的游览器中，默认type为submit，故选中会自动提交。