0

我尝试根据电话号码输入来获取客户（姓名，地址）。如果客户在那里，那么我希望根据我们获得的客户数据自动填写姓名和地址。下面是我的代码。

我的表格

<v-row>
    <v-col cols="12">
        <v-text-field :rules="contactRules" v-model="form.contact" label="Contact" type="number" @input="searchCustomerContact"></v-text-field>
    </v-col>
    <v-col cols="12">
        <v-text-field :rules="nameRules" v-model="form.name" label="Name"></v-text-field>
    </v-col>
    <v-col cols="12">
        <v-textarea rows="1" :rules="address1Rules" v-model="form.address_line_1" label="Address" auto-grow clearable clear-icon="cancel"></v-textarea>
    </v-col>
</v-row>

数据（）

data() {
 return {
  valid: false,
  form: {},
  nameRules: [v => !!v || "Name is required"],
  contactRules: [v => !!v || "Contact is required"],
  address1Rules: [v => !!v || "Address is required"]
 };
},

搜索客户 ()

searchCustomerContact(val) {
  if (val.length == 10) {
    this.$axios
      .get("customers?contact=" + val)
      .then(res => {
        if (res.data != null) {
          this.form.name = res.data.name;
          this.form.address_line_1 = res.data.address_line_1;
        } else {
          this.form.name = null;
          this.form.address_line_1 = null;
        }
      })
      .catch(err => {
        throw err;
      });
  }
}

我的控制器

public function getCustomerByContact()
{
    $data = Order::where('contact', request()->contact)->first();
    return response()->json($data, 200);
}

路线

Route::get('customers', 'OrderController@getCustomerByContact');

我的问题是找到数据时，它无法自动填充名称和地址字段。我是vue的新手。如果联系人不存在，则（姓名，联系人）字段始终为空，所以我认为不需要做那部分（也许）

提前致谢

4

1 回答 1

0

对于那些有这种问题的人，我通过如下编辑解决了

<v-text-field :rules="nameRules" v-model="form.name" label="Name" :value="form.name"></v-text-field>
<v-textarea rows="1" :rules="address1Rules" v-model="form.address_line_1" label="Address" auto-grow clearable clear-icon="cancel" :value="form.address_line_1"></v-textarea>

data() {
 return {
  form: {
    name: "",
    address_line_1: ""
  },
 };
},

添加:value表单文本字段和name & address数据（）->表单

于 2020-07-07T10:28:37.337 回答