PLM之家PLMHome-工业软件与AI结合践行者›社区 › PLM之家-自主工业软件/开源软件借鉴 › AI 人工智能学习专区 › 组件方式开发todolist

热图推荐

[前端框架] 组件方式开发todolist

[复制链接]

2019-8-8 17:24:11 2140 0

admin 发表于 2019-8-8 17:24:11 |阅读模式

admin 楼主

2019-8-8 17:24:11

请使用QQ关联注册PLM之家，学习更多关于内容，更多精彩原创视频供你学习！

您需要登录才可以下载或查看，没有账号？注册

<template>
  <div id="App">
<input v-model="inputValue" />
<button @click="submit">Submit</button>
<ul>
   <todoItem
      v-for="(item,index) in List"
      :key="index"
      :content="item"
      :index="index"
      @delete="handleDelete"
   ></todoItem>
</ul>
  </div>
</template>

<script>
import todoItem from "@/components/item.vue";

export default {
  data: function() {
return {
   List: [],
   inputValue: ""
};
  },
  components: {
todoItem
  },
  methods: {
submit: function() {
   if (this.inputValue != "") {
      this.List.push(this.inputValue);
   }
   this.inputValue = "";
},
handleDelete: function(index) {
   this.List.splice(index, 1);
}
  }
};
</script>

<template>
  <li @click="deleteItem">{{content}}</li>
</template>

<script>
export default {
  props: ["content", "index"],
  data: function() {
return {};
  },
  methods: {
deleteItem: function() {
   this.$emit("delete", this.index);
}
  }
};
</script>

上海点团信息科技有限公司，承接UG NX，CATIA，CREO，Solidworks 等CAx软件，Teamcenter，3D Experience等PLM软件，工业4.0数字化软件的实施\二次开发\培训相关业务，详情QQ 939801026 Tel 18301858168 网址 doTeam.tech

使用道具举报

返回列表发布主题

PLM之家PLMHome-工业软件与AI结合践行者

热图推荐

[前端框架] 组件方式开发todolist

admin 楼主

请使用QQ关联注册PLM之家，学习更多关于内容，更多精彩原创视频供你学习！

发表回复