Question

这是我的输入，我想将值设置为与ic_number相等的密码，而无需再次输入密码。我们可以将ic_number传递给密码v模型吗？

<div class="form-group">
    <label>Ic Number</label>
    <input
        id="ic_number"
        placeholder="Ic Number"
        v-model="form.ic_number"
        type="text"
        name="ic_number"
        class="form-control"
        :class="{ 'is-invalid': form.errors.has('ic_number') }"
    >
    <has-error :form="form" field="ic_number"></has-error>
</div>
<div class="form-group">
    <label>Password</label>
    <input
        id="password"
        placeholder="Password"
        v-model="form.password"
        type="password"
        name="password"
        class="form-control"
        :class="{ 'is-invalid': form.errors.has('passsword') }"
    >
    <has-error :form="form" field="password"></has-error>
</div>

我的vuejs应用程序中的当前代码

export default {
  data() {
    return {
      editMode: false,
      users: {},
      form: new Form({
        id: "",
        name: "",
        ic_number:"",
        no_phone:"",
        email: "",
        password: "",
        type: "",
        bio: "",
        photo: ""
      })
    };
  },

我想这样通过，但什么也没显示

password: password = this.ic_number,

Answer 1

您可以将watch用于ic_number，当ic_number更改时，watch方法将使用

export default {
  data() {
    return {
      editMode: false,
      users: {},

      id: "",
      name: "",
      ic_number:"",
      no_phone:"",
      email: "",
      password: "",
      type: "",
      bio: "",
      photo: ""
    };
  },
  watch:{
    "ic_number":function(val,oldval){ this.password = val }
  }
}

我不确定您是指A代表B还是B代表C

喜欢这个演示

app.vue

<template>
  <div id="app">
    <Test1 v-model="hello"></Test1>
    <div>{{hello}}</div>
  </div>
</template>

<script>
import Test1 from "./components/Test1";

export default {
  name: "App",
  data() {
    return {
      hello: "hello"
    };
  },
  components: {
    Test1
  }
};
</script>

<style>
</style>

test1.vue

<template>
  <div>
    <input v-model="hello">
  </div>
</template>

<script>
export default {
  props: ["value"],
  data() {
    return {
      hello: this.value
    };
  },
  watch: {
    hello: function(val, oldval) {
      this.$emit("input", val);
    }
  }
};
</script>

<style>
</style>

Answer 2

如果您只想使密码的值与ic_number相同。您可以在v-model指令中进行设置，如下所示：

v-model="form.password = this.form.ic_number"

如何将v模型传递到另一个v模型

2 个答案: