如何使用VueJS修复此提交?

时间:2019-02-05 15:55:45

标签: database forms api vue.js submit

我有一个需要通过API和VueJS提交的表单,但是@submit.prevent没有调用我需要的方法。

是否有语法错误或找不到的遗漏?

我已经检查了方括号和其他语法模式,没关系。 我复制了它并删除了一些无用的代码,因此,如果您发现多余的或缺少的“;”或“}”抱歉:p

HTML和JS代码:

<form id="post" method="POST" @submit.prevent="processForm">
  <div class="post post-criar">
    <small>Criar uma publicação</small>
    <div class="post-header">
      <a href="#">
        <div class="post-profile-img"></div>
      </a>
      O que você está precisando, <b>NetCook</b>?
    </div>
    <textarea id="text" name="text" v-model="postText"></textarea>

    <div class="clearfix" id="vendaetroca">
      <div class="col-lg-4">
        <input type="text" class="btn btn-blue" placeholder="R$ Valor" v-model="value">
      </div>
      <div class="col-lg-4">
        <div class="btn btn-green">
          <select name="sale_category" id="sale_category" v-model="saleCategory">
            <option selected disabled>Tipo</option>
            <option value="p">Produto</option>
            <option value="s">Serviço</option>
            <option value="i">Imóvel</option>
            <option value="a">Automóvel</option>
          </select>
        </div>
      </div>
      <div class="col-lg-4">
        <div class="btn btn-purple">
          <select name="trade_category" id="trade_category" v-model="tradeCategory">
            <option disabled selected>Venda ou troca</option>
            <option value="s">Venda</option>
            <option value="t">Troca</option>
          </select>
        </div>
      </div>
    </div>

    <div class="clearfix">
      <div class="col-lg-4">
        <select id="post-categoria" name="category" v-model="category">
          <option selected disabled>Selecionar Categoria</option>
          <option value="geral">Geral</option>
          <option value="venda">Venda e Troca</option>
          <option value="eventos">Eventos</option>
          <option value="indicacoes">Indicações</option>
        </select>
      </div>
      <div class="col-lg-8">
        <label class="btn btn-img" for="anexo-imagem"><img src="img/ico-img.png"> Carregar Arquivo</label>
        <input type="file" id="anexo-imagem" name="image" @change="onFileChange($event, 1)">
        <button type="submit" class="btn btn-line-red">Publicar</button>
      </div>
    </div>
  </div>
</form>

import Form from './core/Form';
var vm = new Vue({
  el: '#app',
  data: {
    name: "", 
    form: new Form(),
    email: "",
    password: "",
    category: "",
    saleCategory: "",
    tradeCategory: "",
    postText: "",
    value:"",
  },
  methods: {
    processForm() {
      this.form.data.sale_category = this.saleCategory;
      this.form.data.trade_category = this.tradeCategory;
      this.form.data.category = this.category;
      this.form.data.image = this.name_image;
      this.form.data.video_file = this.name_file_video;
      this.form.data.value = this.value;
      this.form.data.text= this.postText;
      this.form.data.id = null;
      this.form.data.id_user = null;
      this.form.submit("http://127.0.0.1:8000/api/post/create", this.onSuccess);
      console.log("test");
    },
  }
})

0 个答案:

没有答案