创建uni-app项目
1. 开发规范
为了实现多端兼容，综合考虑编译速度、运行性能等因素、uni-app约定了如下的开发规范：
页面文件遵循Vue单文件组件（SFC）规范
组件标签靠近小程序规范，详见uni-app组件规范
接口能力（JS API）靠近微信小程序规范，但需将前缀wx 替换为 uni ,详见uni-app接口规范
数据绑定及事件处理同Vue.js规范，同时补充了APP及页面的生命周期
为兼容多端运行，建议使用flex布局进行开发
2.目录结构
components uni-app组件目录
-comp-a.vue 可复用的a组件
hybrid 存放本地网页的目录，详见
platforms 存放各平台专用页面的目录，详见
pages 业务页面文件存放的目录
--index
---index.vue index页面
--list
---list.vue list页面
static 存放应用引用静态资源（如图片，视频等）的目录，注意：静态资源只能存放于此
wxcomponents 存放小程序组件的目录，详见
main.js Vue初始化入口文件
App.vue 应用配置，用来配置App全局样式以及监听，应用生命周期
manifest.json 配置应用名称、appid、logo、版本等打包信息
pages.json 配置页面路由、导航条、选项卡等页面类信息
3.变量定义
3.1 页面变量
//正确用法
data () {
return {
title : 'a'
}
}
data() {
//数据驱动视图 //return 对象，是给当前.vue组件模板 提供数据
//而对象里的数据 一般来源后端服务器
// 异步请求API
// 把数据定义在此对象中，vue会代理 监听数据变化 ，如果数据变化，会自动触发视图更新---> 响应式数据
// MVVM模式 M --> model模型 V --> View视图 VM ---> viewmodel视图模型
// Vue提供了很多辅助指令 选项
// react 构建用户界面 js库
return {
title: '测试'
}
},
3.2 methods方法
主要存放一些自定义函数，以及对函数的封装
methods: {
// 自定义函数
set(){
const name = this.name + 'aaa';
return name；
}
}
3.3 computed计算属性
计算属性：是有缓存的，多次调用同一个计算方法去返回值，结果都是第一个方法处理后的结果值。
computed:{
//计算属性： 做一些简单的运算
//计算属性是有缓存的，多次使用同一个计算属性，只会显示第一次处理的结果的值。
getTitle(){
const title = this.title;
return title.split('').reverse().join('-');
}
},
3.4 filters过滤器
用来对数据的不同格式处理，从而处理成想要的数据形式。
<text> {{ time | format }} </text> //过滤器的书写格式 其中 | 为管道符
<text> {{ online | num}} </text> //对在线人数的数据格式处理
import secondFormat from "second-format" //引入外部的封装插件
import {numberFormat} from "js-num-format" //需要对其进行解构
data() {
return {
time: 125,
online:1200000,
}
}
filters:{
format : secondFormat，
num: numberFormat ,
}
