Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/xpath/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Vuejs2 是否有任何方法可以在vuejs中的同一数据对象内使用数据属性?_Vuejs2 - Fatal编程技术网

Vuejs2 是否有任何方法可以在vuejs中的同一数据对象内使用数据属性?

Vuejs2 是否有任何方法可以在vuejs中的同一数据对象内使用数据属性?,vuejs2,Vuejs2,我是Vue js以及前端框架的初学者。最近我了解了vue js。所以我在vue js中有一个很小的任务。简单地添加用户并显示我添加的所有用户。这是我的代码 <div id="todo"> <b-card class="col-md-12 text-center"> <b-row> <b-col md="4"> <b-input v-model="firstName" placeholde

我是Vue js以及前端框架的初学者。最近我了解了vue js。所以我在vue js中有一个很小的任务。简单地添加用户并显示我添加的所有用户。这是我的代码

<div id="todo">
    <b-card class="col-md-12 text-center">
      <b-row>
        <b-col md="4">
          <b-input v-model="firstName" placeholder="Firstname"></b-input>
        </b-col>
        <b-col md="4">
          <b-input v-model="lastName" placeholder="Lastname"></b-input>
        </b-col>
        <b-col md="2">
          <b-btn class="btn btn-success" @click="addUser">Add User</b-btn>
        </b-col>
      </b-row>
    </b-card>
    <table>
      <caption>Users</caption>
      <thead>
        <tr>
          <th>Index</th>
          <th>First name</th>
          <th>Last name</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="(u, index) in users" :key="index">
          <td>{{u.uid}}</td>
          <td>{{u.firstname}}</td>
          <td>{{u.lastname}}</td>
        </tr>
      </tbody>
    </table>
  </div>

<script>
export default {
  name: "todo",
  data() {
    return {
      users: [{ id: **this.uid**, firstname: "John", lastname: "Doe" }],
      **uid**: 1,
      firstName: "",
      lastName: ""
    };
  },
  methods: {
    addUser() {
      let newUser = {
        id: this.id + 1,
        firstname: this.firstName,
        lastname: this.lastName
      };
      this.users.push(newUser);
      (this.firstName = ""), (this.lastName = "");
    }
  }
};
</script>

添加用户
使用者
指数
名字
姓
{{u.uid}
{{u.firstname}
{{u.lastname}
导出默认值{
名称:“待办事项”,
数据(){
返回{
用户:[{id:*this.uid**,名字:“John”,姓氏:“Doe”},
**uid**:1,
名字:“,
姓氏:“
};
},
方法:{
addUser(){
让newUser={
id:this.id+1,
名字:这个,名字,
lastname:this.lastname
};
this.users.push(newUser);
(this.firstName=“”),(this.lastName=“”);
}
}
};
现在,我的问题是,我可以在数据对象的users数组中使用uid吗


您可以通过在created方法中运行代码,如下所示

{
   created () {
      let firstUser = { id: this.uid, firstname: "John", lastname: "Doe" }
      this.users.push(firstUser)
   },
   data () {
      users: [],
      uid: 1
   }
}

您可以在数据中使用它,如下所示:

<script>
const uid = 1;

export default{
    data(){
       return {
          id : uid
       }

    }
}
</script>

常数uid=1;
导出默认值{
数据(){
返回{
id:uid
}
}
}