uni-app开发基本知识点

uni-app:

开始：必须要有一个根view结点。

 

 

 外部文件引用方式的变化：

js要require进来，变成了对象。

  <script>  
        var util = require('../../../common/util.js');  //require这个js模块  
        var formatedPlayTime = util.formatTime(playTime); //调用js模块的方法  
    </script>

 

 

 高级引入方法：

    <!-- 直接使用js模块的属性。在hello uni-app有示例   -->
    var dateUtils = require('../../../common/util.js').dateUtils; 
    <!-- 将js导入并重命名为echarts，然后使用echarts.来继续执行方法。在hello uni-app有示例 -->
    import * as echarts from '/components/echarts/echarts.simple.min.js';

css外部文件引入：css外部文件导入。全局样式，在根目录下的 app.vue 里写入，每个页面都会加载 app.vue 里的样式。

   <style>  
        @import "./common/uni.css";  
        .uni-hello-text{  
            color:#7A7E83;  
        }  
    </style>

另外，vue支持组件导入，可以更方便的封装一个包括界面、js、样式的库

 内置组件的变化：https://uniapp.dcloud.io/component/README

应用生命周期：

 

 注意点：应用生命周期仅可在App.vue中监听，在其它页面监听无效。 2 onlaunch里进行页面跳转，如遇白屏报错，请参考https://ask.dcloud.net.cn/article/35942

同时还包含页面生命周期：这里不做详细介绍，详情请参考：https://uniapp.dcloud.io/collocation/frame/lifecycle?id=%e9%a1%b5%e9%9d%a2%e7%94%9f%e5%91%bd%e5%91%a8%e6%9c%9f

事件映射表：

 

uni-app组件的概念：

 

• 组件是视图层的基本组成单元。
• 组件是一个单独功能模块的封装。
• 一个组件包括开始标签和结束标签，标签上可以写属性，并对属性赋值。内容则写在两个标签之内。
  • 根节点为 <template>，这个 <template> 下只能且必须有一个根 <view> 组件。这是vue单文件组件规范。
  • 一个组件的 data 选项必须是一个函数。