> 文档中心 > HarmonyOS应用开发第一次作业笔记

HarmonyOS应用开发第一次作业笔记

1、根据P6视频做出做出记事本删除添加案例 

export default {    data: { todoList:[  {     info:'给老王打个电话',     status : true }, {     info:'输出工作计划',     status : false }, {     info:'和小王对接需求',     status : true }, {     info:'整理客户资料',      status : false },  {      info: '和朋友一起聚餐',      status: false  } ]    },    onInit() { this.title = this.$t('strings.world');    },    remove(index){    console.log(index)    this.todoList.splice(index,1);    },    switchChange(index){    this.todoList[index].status = !this.todoList[index].status    },    addTodo(){ this.todoList.push({     info: 'IDE工具无法监听键盘输入',     status: false     })    },    computed :{ todocount(){     let num =0;     this.todoList.forEach(element => {  if( !element.status){      num++  } }); return num }    }}
.container {    flex-direction: column;    justify-content: flex-start;    align-items: center;    padding-bottom : 100px;}.title {    font-size: 25px;    margin-top: 20px;    margin-bottom: 20px;    color: #000000;    opacity: 0.9;    font-size: 28px;}.item {    width: 325px;    padding: 10px 0;    flex-direction: row;    align-items: center;    justify-content: space-around;    border-bottom: 1px solid #eee;}.todo {    color: #000;    width: 180px;    font-size: 18px;}.switch{    font-size: 12px;texton-color: green;textoff-color : red;text-padding : 5px;width: 100px;    height: 24px;    allow-scale: false;}.remove {    font-size: 12px;    margin-left: 10px;    width: 50px;    height: 22px;    color: #fff;    background-color: red;}.info {    width: 100%;    margin-top: 10px;    justify-content: center;}.info-text{    font-size: 18px;    color: #AD7A1B;}.info-num {    color: orangered;    margin-left: 10px;    margin-right: 18px;}.add-todo {    position: fixed;    left: 0;    bottom: 0;    width: 108%;    height: 68px;    flex-direction: row;    justify-content: space-around;    align-items: center;    background-color: #ddd;}.plan-input{    width: 248px;height: 40px;    background-color : #fff;}.plan-btn {    width: 90px;    height: 35px;    font-size: 15px;}
待办事项
{{$item.info}}
您还有 {{todocount}} 件事情待办,加油!