未验证 提交 aaf1e148 编写于 作者: W wanganxp 提交者: GitHub

Update snippet.md

上级 cd534733
### 使用代码块直接创建组件模板
为提升开发效率,HBuilderX将 ```uni-app``` 常用代码封装成了以 ```u``` 开头的代码块,如在 ```template``` 标签内输入 ```ulist``` 回车,会自动生成如下代码:
```
<view class="uni-list">
<view class="uni-list-cell">
<view class="uni-list-cell-navigate uni-navigate-right" v-for="(item,index) in list" :key="index">
{{item.value}}
</view>
</view>
</view>
```
代码块分为Tag代码块、JS代码块,如在 ```script``` 标签内输入 ```uShowToast``` 回车,会自动生成如下代码:
```
uni.showToast({
title: '',
mask: false
duration: 1500
});
```
```uni-app```已支持代码块见下方列表。
#### Tag代码块
- uButton
- uCheckbox
- uGrid:宫格,需引用uni ui
- uList:列表,需引用uni ui
- uListMedia
- uRadio
为提升开发效率,HBuilderX将 ```uni-app``` 常用代码封装成了以 ```u``` 开头的代码块,如在 ```template``` 标签内输入 ```ulist``` 回车,会自动生成如下代码:
```
<view class="uni-list">
<view class="uni-list-cell">
<view class="uni-list-cell-navigate uni-navigate-right" v-for="(item,index) in list" :key="index">
{{item.value}}
</view>
</view>
</view>
```
代码块分为Tag代码块、JS代码块,如在 ```script``` 标签内输入 ```uShowToast``` 回车,会自动生成如下代码:
```
uni.showToast({
title: '',
mask: false
duration: 1500
});
```
```uni-app```已支持代码块见下方列表。
#### Tag代码块
- uButton
- uCheckbox
- uGrid:宫格,需引用uni ui
- uList:列表,需引用uni ui
- uListMedia
- uRadio
- uSwiper
- ......
......@@ -42,25 +42,25 @@ uni.showToast({
除组件外,其他常用代码块包括:
- viewfor:生成一段带有v-for循环结构的视图代码块
- vbase:生成一段基本的vue代码结构
#### JS代码块
##### uni api代码块
- uRequest
- uGetLocation
- uShowToast
- uShowLoading
- uHideLoading
- uShowModal
- uShowActionSheet
- uNavigateTo
- uNavigateBack
- uRedirectTo
- uStartPullDownRefresh
- uStopPullDownRefresh
- uLogin
- uShare
- vbase:生成一段基本的vue代码结构
#### JS代码块
##### uni api代码块
- uRequest
- uGetLocation
- uShowToast
- uShowLoading
- uHideLoading
- uShowModal
- uShowActionSheet
- uNavigateTo
- uNavigateBack
- uRedirectTo
- uStartPullDownRefresh
- uStopPullDownRefresh
- uLogin
- uShare
- uPay
- ......
......@@ -74,12 +74,12 @@ uni.showToast({
- vComponents:输出 components: {}
##### 其他常用js代码块
- iff:简单if
- forr:for循环结构体
- fori:for循环结构体并包含i
- funn:函数
- iff:简单if
- forr:for循环结构体
- fori:for循环结构体并包含i
- funn:函数
- funa:匿名函数
- rt:return true
- rt:return true
- clog:输出:"console.log()"
- clogvar:增强的日志输出,可同时把变量的名字打印出来
- varcw:输出:"var currentWebview = this.$mp.page.$getAppWebview()"
......@@ -115,32 +115,32 @@ uni.showToast({
![uni-app](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/debug2.png)
### 关于 App 的调试
自 `HBuilderX 2.0.3+ Alpha` 版本起开始支持 `App` 端的调试
#### 打开调试窗口
在 `HBuilderX` 中,正确运行项目: `运行 --> 运行到手机或模拟器 --> 选择设备`,项目启动后,在下方的控制台选择 `debug` 图标。
![debug](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/debug-icon.png)
正确打开调试窗口后,显示如下:
![debug](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/csdndebug-window.png)
#### 调试页面
在调试窗口控制台的 Sources (图中指示1) 栏,可以给 js 打断点调试。
在 uniapp:// (图中指示2)下找到需要调试的页面,单击打开 ,在右侧可以看到我们需要调试的内容(图中指示3)。在需要调试的代码行号的位置,点击打上断点(图中指示4)。
![debug](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/csdndebug-log.png)
之后,在设备上进行操作,进入断点位置,可以方便我们跟踪调试代码。
![debug](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/csdndebug-breakpoint.png)
Tip
- 不支持非自定义组件模式
- `vue` 和 `nvue` 页面都能打断点调试
- 目前仅支持 `nvue` 页面查看元素,`vue` 页面暂不支持,`Android` 暂不支持查看 `style`
自 `HBuilderX 2.0.3+` 版本起开始支持 `App` 端的调试。
#### 打开调试窗口
在 `HBuilderX` 中,正确运行项目: `运行 --> 运行到手机或模拟器 --> 选择设备`,项目启动后,在下方的控制台选择 `debug` 图标。
![debug](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/debug-icon.png)
正确打开调试窗口后,显示如下:
![debug](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/csdndebug-window.png)
#### 调试页面
在调试窗口控制台的 Sources (图中指示1) 栏,可以给 js 打断点调试。
在 uniapp:// (图中指示2)下找到需要调试的页面,单击打开 ,在右侧可以看到我们需要调试的内容(图中指示3)。在需要调试的代码行号的位置,点击打上断点(图中指示4)。
![debug](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/csdndebug-log.png)
之后,在设备上进行操作,进入断点位置,可以方便我们跟踪调试代码。
![debug](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/csdndebug-breakpoint.png)
Tip
- debug仅支持自定义组件模式。如果是非自定义组件模式,请在manifest里配置选为自定义组件模式。非自定义组件模式即将停止支持,[详见](https://ask.dcloud.net.cn/article/36385)
- `vue` 和 `nvue` 页面都能打断点调试
- 目前仅支持 `nvue` 页面审查元素,`vue` 页面暂不支持,`Android` 暂不支持查看 `style`
<!-- uni-app的App端没有webview调试(即webkit remote debug)。
......@@ -162,4 +162,4 @@ Tip
HBuilderX版与cli版互转指南参考:[https://ask.dcloud.net.cn/article/35750](https://ask.dcloud.net.cn/article/35750)
如果是发布App,则需要使用[离线打包](https://ask.dcloud.net.cn/docs/#//ask.dcloud.net.cn/article/508),配置原生环境,来实现持续集成。(目前HBuilderX还不支持命令行生成wgt资源和云打包,欢迎到需求墙投票:[https://dev.dcloud.net.cn/wish/](https://dev.dcloud.net.cn/wish/))
\ No newline at end of file
如果是发布App,则需要使用[离线打包](https://ask.dcloud.net.cn/docs/#//ask.dcloud.net.cn/article/508),配置原生环境,来实现持续集成。(目前HBuilderX还不支持命令行生成wgt资源和云打包,欢迎到需求墙投票:[https://dev.dcloud.net.cn/wish/](https://dev.dcloud.net.cn/wish/))
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册