uniapp是一个基于vue.js的跨平台开发框架，可以开发ios、android、h5以及小程序等多个平台的应用程序。而在uniapp的开发中，有一些比较重要的写法需要我们注意和掌握，下面我们一起来详细了解一下。
一、框架的结构
UniApp的源代码主要由三部分组成：基础库、编译器和平台代码。其中，基础库由uni-core和uni-helpers两部分组成，负责提供UniApp必要的逻辑支持，编译器主要是对项目进行构建和打包，而平台代码则根据不同平台提供相应的API、组件库和UI框架等。
二、目录结构
在UniApp的开发中，我们应该优先关注项目的目录结构。在UniApp中，可以通过点击“HbuilderX -> 新建UniApp项目”来快速创建一个UniApp项目，并自动添加目录结构，如下：
├── App.vue
├── common
│ ├── api.js
│ ├── config.js
│ ├── mixin.js
│ └── utils.js
├── components
├── main.js
├── manifest.json
├── pages
│ └── index
│ ├── index.vue
│ └── main.js
├── pages.json
├── static
│ └── logo.png
└── uni.scss
其中，App.vue是入口文件；common目录是公共资源，包含api.js(接口请求)、config.js(配置信息)、mixin.js(混合)、utils.js(工具类)等文件；components是组件库，可以存放一些自己封装的组件；main.js是入口JS文件，manifest.json是项目配置文件，pages是页面集合，包括各个子页面和组件，pages.json是页面配置文件。static文件夹是静态资源目录，放一些图片、样式和JS等。
三、组件
在UniApp中，组件的使用和Vue.js中的使用非常类似，只需用template标签来定义组件模板即可。同时，UniApp也提供了一些常用的组件库，如uni-icons(图标)、uni-list(列表)、uni-form(表单)、uni-tabbar(底部菜单栏)等，也可以按需自定义组件库。
四、路由
在UniApp的开发中，路由也是非常重要的一环。可以通过在pages.json中配置路由，如下：
{
"pages": [
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "首页"
}
},
{
"path": "pages/detail/detail",
"style": {
"navigationBarTitleText": "详情页"
}
}
]}
功能列表：底层程序与前台页面分离的效果，对页面的修改无需改动任何程序代码。完善的标签系统，支持自定义标签，公用标签，快捷标签，动态标签，静态标签等等，支持标签内的vbs语法，原则上运用这些标签可以制作出任何想要的页面效果。兼容原来的栏目系统，可以很方便的插入一个栏目或者一个栏目组到页面的任何位置。底层模版解析程序具有非常高的效率，稳定性和容错性，即使模版中有错误的标签也不会影响页面的显示。所有的标
这里定义了两个路由，分别指向"pages/index/index"和"pages/detail/detail"页面。在跳转时可以使用uni.navigateTo和uni.redirectTo等API完成页面跳转。
五、全局变量和方法
在UniApp的开发中，我们通常需要定义一些全局变量和方法来方便我们的开发。可以通过在App.vue中定义公共变量和方法，然后通过Vue.prototype.$xxx来挂载它们，实现全局调用。如下：
export default {
onLoad() {
console.log(this.globalData) //获取全局变量
},
globalData: {
uname: 'admin',
age: 20
},
onShow() {
}
}
//挂载全局方法
Vue.prototype.$myfunc = function () {
console.log('This is a global function!')
}
六、开发调试
在进行UniApp的开发时，我们可以使用HbuilderX这个IDE进行开发调试。在完成代码编写和保存后，可以通过点击“运行 -> 运行到手机或者模拟器”进行项目的运行和调试。此外，也可以在运行时开启调试模式，在开发者工具中进行调试。
总结
以上就是UniApp的一些常用写法，通过对这些写法的掌握，我们可以更加高效地进行UniApp的开发，开发出更加优秀的应用程序。
