Vue提交表单

作者: 会飞的兔子zy | 来源:发表于2019-06-27 14:37 被阅读0次

新建form表单

<form v-on:submit.prevent="submit()">
    <input placeholder="真实姓名" maxlength="15" type="text" v-model="address.name" />
    <input placeholder="手机号" maxlength="13" type="tel" v-model="address.tel" />
    <input placeholder="省 市 区"  type="text"  v-model="address.pcd" />
    <input placeholder="详细地址" maxlength="120" type="text" v-model="address.site" />
<button type="submit" class="ui-button" ><span>保存地址</span></button></form>

js代码

export default {
        name: "Newaddress",
        data() {
            return {
                address: {
                    name: '',
                    tel: '',
                    pcd: '',
                    site: ''
                }
            }
        },
        methods: {
            submit() {
                this.axios.post('api/address/new', this.address)
                    .then((res) => {
                        this.$router.push({name:'address'})
                })
            }
        }

    }