快捷开发神器
因为uniapp是一个框架,所以很多的功能都已经写好,类似vue,例如页面路由,各种组件在新建项目时已经帮你下载好了,也不需要再注册组件等操作,直接引用即可。
01下载编辑器
下载uniapp官方编辑器HbuiderX,注册登陆。
02新建uniapp项目
进去编辑器,新建,项目,uniapp项目,命名项目,选带ui的模板,点击创建,此时项目已经创建完毕。
03配置浏览器
该编辑器支持配置Google,火狐浏览器,将电脑的Google浏览器路径填上就行了。配置是为了预览项目。
04下载插件
插件是为了支持项目更好的运行,下载内置浏览器,sass插件,因为插件市场有些插件需要sass编译css。
05写项目
打开项目中的index.vue,开始写页面内容,可以打开官网,复制用到的组件代码直接用,也可以直接在页面内输入u,就会弹出内置组件,按上下方向键即可选择对应的组件,回车即可复制到内容中。
每个页都一样,要几个页,就新建几个页面,点击新建,页面,vue页面。
实现每个页面之间的切换,用底部导航,和微信小程序一样,去官网复制tabbar代码,这个代码要写在配置页pages.json中,有几个页面,就设置几个选项,官网说的很清楚,然后在配置各个页面的路径,这一步做完之后就可以实现切换页面。
06打包成app
点击项目中的mainfast.json,基础,点击获取Appid,版本号填1。
配置app图标,启动图等,这些图片要遵循规定的标准尺寸。
点击编辑器的菜单,发行,云打包,选安卓,写包名,格式为**.**,选公用证书,去掉广告,点击打包。
等待打包完成,编辑器的控制台,会输出一个下载地址,点击这个地址,复制这个地址,发送到手机。手机上点击下载安装,
有些组件做不了的东西,可以使用flex布局和css以及js实现。
---- 关于插件市场的使用 ----
01
下载,解压,有两个文件,一个静态资源,一个页面文件,把静态资源文件夹拷贝到static目录下,把页面文件拷贝到pages目录下,在pages.json中添加这个页面路径,在tabbar中地址配好,其实就实现了通过tabbar切换一个单页,不过这个单页是复制来的。
02
下载,解压,只有一个文件,把这个文件拷贝到项目的components目录下,和局部组件一样,import引入,再通过组件介绍配置这个组件的相关js即可使用。