构建环境

node.js

Deveco Stduio

前端快速开发

预览器

SDK管理

JS开发目录结构

• src
  • main
    • java
    • js
      • default
        • common---------公共文件，主要用来存放图片，json基础数据等
          • datas
          • images
        • components-----------自定义组件
          • ctest
            • ctest.css
            • ctest.hml
            • ctest.js
          • navbar
        • i18n---------------多语言配置，开发保留文件夹，不可重命名
          • en-US.json
          • zh-CN.json
        • pages
          • index------------页面
            • index.css
            • index.hml
            • index.js
          • app.js-----------应用入口，配置应用生命周期
    • resourse
    • config.json---------------应用配置，配置路由权限

image-animator组件实现帧动画

Chart组件及使用

![在这里插入图片描述](https://img-blog.csdnimg.cn/c278228198e546c3bcd3541d809b5b0e.png

通过common中的js文件导入数据

barData.js

export default [    { strokeColor: '#0081ff', fillColor: '#cce5ff', data: [763, 550, 551, 554, 731, 654, 525, 696, 595, 628, 791, 505, 613, 575, 475, 553, 491, 680, 657, 716], gradient: true,    }]

目录

Ability、FA、PA

Ability 是应用所具备能力的抽象、Ability 由一个或多个 FA（Feature Ability）或 PA（Particle Ability）组成。其中，FA 有 UI 界面，提供与用户交互的能力；而 PA 无 UI 界面，提供后台运行任务的能力以及统一的数据访问抽象。

TodoList应用

获取input输入框的值，将其添加到新的待办事项中

addTodo() { this.todoList.push({     info:this.inputTodo,     status:false })    },    getNewTodo(e) { this.inputTodo = e.value;    }