diff --git a/docs/component/README.md b/docs/component/README.md index 437c32c863a5f75f0103428a55ebd01e7b0579d2..152d1f02da6b72138731839c9651a3b875fd40f8 100644 --- a/docs/component/README.md +++ b/docs/component/README.md @@ -52,7 +52,7 @@ uni-app为开发者提供了一系列基础组件，类似HTML里的基础标签 |style|String|组件的内联样式|可以动态设置的内联样式| |hidden|Boolean|组件是否隐藏|所有组件默认是显示的| |data-*|Any|自定义属性|组件上触发的事件时，会发送给事件处理函数| -|@\*|EventHandler|组件的事件|详见各组件详细文档，事件绑定参考 [事件处理器](/use?id=事件处理器)| +|@\*|EventHandler|组件的事件|详见各组件详细文档，事件绑定参考 [事件处理器](/vue-basics?id=事件处理器)| ### 特殊属性 diff --git a/docs/component/input.md b/docs/component/input.md index f92c99920daff41bccf7c384f51cd1393c951fa7..0d34cd3d6e8a7c1569acc6eb88943e21618fd627 100644 --- a/docs/component/input.md +++ b/docs/component/input.md @@ -33,7 +33,7 @@ **Tips** - `input` 事件处理函数可以直接 return 一个字符串，将替换输入框的内容。仅微信小程序支持。 -- 如果遇到 value 属性设置不生效的问题参考：[组件属性设置不生效解决办法](/use?id=%E5%B8%B8%E8%A7%81%E9%97%AE%E9%A2%98) +- 如果遇到 value 属性设置不生效的问题参考：[组件属性设置不生效解决办法](/vue-api?id=_4-组件属性设置不生效解决办法) - `input` 组件上有默认的 `min-height` 样式，如果 `min-height` 的值大于 `height` 的值那么 `height` 样式无效。 **type 有效值** @@ -113,7 +113,7 @@ App平台软键盘弹出有 adjustResize|adjustPan 两种模式，默认为 adju - adjustResize模式在Android App上，弹起键盘和收回键盘时，因为要重设webview窗体高度，可能会在个别安卓机型闪现灰屏或漏出下层页面内容。 - 小程序端在 input 聚焦期间，避免使用 css 动画。 - H5平台只能在用户交互时修改 focus 生效。 -- 如果遇到 focus 属性设置不生效的问题参考：[组件属性设置不生效解决办法](/use?id=%E5%B8%B8%E8%A7%81%E9%97%AE%E9%A2%98) +- 如果遇到 focus 属性设置不生效的问题参考：[组件属性设置不生效解决办法](/vue-api?id=_4-组件属性设置不生效解决办法) - 如需禁止点击其他位置收起键盘的默认行为，可以监听`touch`事件并使用`prevent`修饰符（仅支持App-v3、H5，其他平台可以通过设置`focus`来使输入框重新获取焦点），例如在确认按钮上使用：```@touchend.prevent="onTap"``` diff --git a/docs/component/movable-view.md b/docs/component/movable-view.md index 476d3ffb3b13a9af8119abb4bed70e7f6cce480f..1321e7e842040caab860d7b5175ce44cdad1bf39 100644 --- a/docs/component/movable-view.md +++ b/docs/component/movable-view.md @@ -75,7 +75,7 @@ **Tips** - movable-view必须在``组件中，并且必须是直接子节点，否则不能移动。 -- 如果遇到x、y、scale属性设置不生效的问题参考：[组件属性设置不生效解决办法](/use?id=%E5%B8%B8%E8%A7%81%E9%97%AE%E9%A2%98) +- 如果遇到x、y、scale属性设置不生效的问题参考：[组件属性设置不生效解决办法](/vue-api?id=_4-组件属性设置不生效解决办法) - 除了H5端和app-nvue端，其他平台不支持内嵌video、map等原生组件。更新：微信基础库2.4.4起支持了原生组件在 scroll-view、swiper、movable-view 中的使用 **示例**[查看演示](https://hellouniapp.dcloud.net.cn/pages/component/movable-view/movable-view) diff --git a/docs/component/scroll-view.md b/docs/component/scroll-view.md index db2fb86f7f587f325240b1cc9b25a7d8dc35448d..b87836051647c56db73a44c35c0675c66a9db065 100644 --- a/docs/component/scroll-view.md +++ b/docs/component/scroll-view.md @@ -171,5 +171,5 @@ export default { - scroll-into-view 的优先级高于 scroll-top。 - scroll-view是区域滚动，不会触发页面滚动，无法触发pages.json配置的下拉刷新、页面触底onReachBottomDistance、titleNView的transparent透明渐变。 - 若要使用下拉刷新，建议使用页面的滚动，而不是 scroll-view 。插件市场有前端模拟的基于scroll-view的下拉刷新，但性能不佳。如必需使用前端下拉刷新，推荐使用基于wxs的下拉刷新，性能会比基于js监听方式更高。 -- 如果遇到scroll-top、scroll-left属性设置不生效的问题参考：[组件属性设置不生效解决办法](/use?id=%E5%B8%B8%E8%A7%81%E9%97%AE%E9%A2%98) +- 如果遇到scroll-top、scroll-left属性设置不生效的问题参考：[组件属性设置不生效解决办法](/vue-api?id=_4-组件属性设置不生效解决办法) - scroll-view的滚动条设置，可通过css的-webkit-scrollbar自定义，包括隐藏滚动条。（app-nvue无此css） diff --git a/docs/component/swiper.md b/docs/component/swiper.md index 18ecec49edb3577fd6522a89ecb36088c74e96bc..7b5ed2910a22c7512286a19d9c725d91056c753d 100644 --- a/docs/component/swiper.md +++ b/docs/component/swiper.md @@ -50,7 +50,7 @@ change 事件返回 detail 中包含一个 source 字段，表示导致变更的 - 使用竖向滚动时，需要给 ```` 一个固定高度，通过 css 设置 height。 - 注意：其中只可放置 ```` 组件，否则会导致未定义的行为。 -- 如果遇到current、current-item-id属性设置不生效的问题参考：[组件属性设置不生效解决办法](/use?id=%E5%B8%B8%E8%A7%81%E9%97%AE%E9%A2%98) +- 如果遇到current、current-item-id属性设置不生效的问题参考：[组件属性设置不生效解决办法](/vue-api?id=_4-组件属性设置不生效解决办法) - banner图的切换效果和指示器的样式，有多种风格可自定义，可在[uni-app插件市场](https://ext.dcloud.net.cn/search?q=%E8%BD%AE%E6%92%AD)搜索 - swiper在App的vue中、百度支付宝头条QQ小程序中，不支持内嵌video、map等原生组件。在微信基础库2.4.4起和App nvue2.1.5起支持内嵌原生组件。竖向的swiper内嵌视频可实现抖音、映客等视频垂直拖动切换效果。 - 同时监听 change transition，开始滑动时触发transition, 放开手后，在ios平台触发顺序为 transition... change，Android/微信小程序/支付宝为 transition... change transition... diff --git a/docs/component/textarea.md b/docs/component/textarea.md index 25193cdc5ff6969510fce024946c7fe7e54a40a9..5dbb907a0528b5cc8d8f9324ae7357b86640f883 100644 --- a/docs/component/textarea.md +++ b/docs/component/textarea.md @@ -81,11 +81,11 @@ export default { **Tips** - textarea 的 blur 事件会晚于页面上的 tap 事件，如果需要在 button 的点击事件获取 textarea，可以使用 form 的 @submit。 -- 如果遇到 value 属性设置不生效的问题参考：[组件属性设置不生效解决办法](/use?id=%E5%B8%B8%E8%A7%81%E9%97%AE%E9%A2%98) +- 如果遇到 value 属性设置不生效的问题参考：[组件属性设置不生效解决办法](/vue-api?id=_4-组件属性设置不生效解决办法) - 微信小程序、百度小程序、字节跳动小程序中，textarea是原生组件，层级高于前端组件，请勿在 scroll-view、swiper、picker-view、movable-view 中使用 textarea 组件。覆盖textarea需要使用cover-view。[详见](/component/native-component) - 小程序端 css 动画对 textarea 组件无效。 - H5 平台只能在用户交互时修改 focus 生效。 -- 如果遇到 focus 属性设置不生效的问题参考：[组件属性设置不生效解决办法](/use?id=%E5%B8%B8%E8%A7%81%E9%97%AE%E9%A2%98) +- 如果遇到 focus 属性设置不生效的问题参考：[组件属性设置不生效解决办法](/vue-api?id=_4-组件属性设置不生效解决办法) - 软键盘的弹出和收起逻辑，详见[input的文档](/component/input?id=app%E5%B9%B3%E5%8F%B0ios%E7%AB%AF%E8%BD%AF%E9%94%AE%E7%9B%98%E4%B8%8A%E6%96%B9%E6%A8%AA%E6%9D%A1%E5%8E%BB%E9%99%A4%E6%96%B9%E6%A1%88) - 如需禁止点击其他位置收起键盘的默认行为，可以监听`touch`事件并使用`prevent`修饰符（仅支持App-v3、H5，其他平台可以通过设置`focus`来使输入框重新获取焦点），例如在确认按钮上使用：```@touchend.prevent="onTap"``` diff --git a/docs/vue-api.md b/docs/vue-api.md index f1477d10795f29d931f35ea7b16751f3ad05ed7e..7f7400edff16152be6e63ef5d70c2808c01bd52c 100644 --- a/docs/vue-api.md +++ b/docs/vue-api.md @@ -11,7 +11,7 @@ |Vue.config.ignoredElements | 须使 Vue 忽略在 Vue 之外的自定义元素 [详情](https://cn.vuejs.org/v2/api/#ignoredElements) |√ | √ | √ |强烈不推荐，会覆盖uni-app框架配置的内置组件 | |Vue.config.keyCodes | 给 v-on 自定义键位别名 [详情](https://cn.vuejs.org/v2/api/#keyCodes) |√ | x | x | | |Vue.config.performance | 设置为 true 以在浏览器开发工具的性能/时间线面板中启用对组件初始化、编译、渲染和打补丁的性能追踪 [详情](https://cn.vuejs.org/v2/api/#performance) |√ |x | x |只在Web环境下支持 | -|Vue.config.productionTip | 设置为 false 以阻止 vue 在启动时生成生产提示 [详情](https://cn.vuejs.org/v2/api/#productionTip) |√ | √ | √ | | +|Vue.config.productionTip | 设置为 false 以阻止 vue 在启动时生成生产提示 [详情](https://cn.vuejs.org/v2/api/#productionTip) |√ | √ | √ | - | @@ -60,7 +60,7 @@ |functional | 使组件无状态 (没有 data) 和无实例 (没有 this 上下文) [详情](https://cn.vuejs.org/v2/api/#functional) |√ | x | x | | |model | 允许一个自定义组件在使用 v-model 时定制 prop 和 event [详情](https://cn.vuejs.org/v2/api/#model) |√ |√ | x | | |inheritAttrs | inheritAttrs属性默认值为true，表示允许组件的根节点继承$attrs包含的属性 [详情](https://cn.vuejs.org/v2/api/#inheritAttrs) |√ |√ | x | | -|comments | 当设为 true 时，将会保留且渲染模板中的 HTML 注释 [详情](https://cn.vuejs.org/v2/api/#comments) |√ | x | x | | +|comments | 当设为 true 时，将会保留且渲染模板中的 HTML 注释 [详情](https://cn.vuejs.org/v2/api/#comments) |√ | x | x | - | @@ -85,7 +85,7 @@ |vm.$refs | 一个对象，持有注册过 ref attribute 的所有 DOM 元素和组件实例[详情](https://cn.vuejs.org/v2/api/#vm-refs) |√ | √ | √ |非H5端只能用于获取自定义组件，不能用于获取内置组件实例（如：view、text） | |vm.$isServer | 当前 Vue 实例是否运行于服务器 [详情](https://cn.vuejs.org/v2/api/#vm-isServer) |√ | √ | x |App端V3总是返回false | |vm.$attrs | 包含了父作用域中不作为 prop 被识别 (且获取) 的 attribute 绑定 [详情](https://cn.vuejs.org/v2/api/#vm-attrs) |√ | √ | x | | -|vm.$listeners | 包含了父作用域中的 (不含 .native 修饰器的) v-on 事件监听器 [详情](https://cn.vuejs.org/v2/api/#vm-listeners) |√ | √ | x | | +|vm.$listeners | 包含了父作用域中的 (不含 .native 修饰器的) v-on 事件监听器 [详情](https://cn.vuejs.org/v2/api/#vm-listeners) |√ | √ | x | - | @@ -107,7 +107,7 @@ |vm.$mount() | 手动地挂载一个未挂载的实例 [详情](https://cn.vuejs.org/v2/api/#vm-mount) |√ | x | x | | |vm.$forceUpdate() | 迫使 Vue 实例重新渲染 [详情](https://cn.vuejs.org/v2/api/#vm-forceUpdate) |√ | √ | √ | | |vm.$nextTick() | 将回调延迟到下次 DOM 更新循环之后执行 [详情](https://cn.vuejs.org/v2/api/#vm-nextTick) |√ | √ | √ | | -|vm.$destroy() | 完全销毁一个实例 [详情](https://cn.vuejs.org/v2/api/#vm-destroy) |√ | √ | √ | | +|vm.$destroy() | 完全销毁一个实例 [详情](https://cn.vuejs.org/v2/api/#vm-destroy) |√ | √ | √ | - | @@ -131,7 +131,7 @@ |v-model| 在表单控件或者组件上创建双向绑定 [详情](https://cn.vuejs.org/v2/api/#v-model) |√ | √ | √ | | |v-pre | 跳过这个元素和它的子元素的编译过程 [详情](https://cn.vuejs.org/v2/api/#v-pre) |√ | √ | x | | |v-cloak| 这个指令保持在元素上直到关联实例结束编译 [详情](https://cn.vuejs.org/v2/api/#v-cloak) |√ | x | x | | -|v-once | 只渲染元素和组件一次 [详情](https://cn.vuejs.org/v2/api/#v-once) |√ | √ | x | | +|v-once | 只渲染元素和组件一次 [详情](https://cn.vuejs.org/v2/api/#v-once) |√ | √ | x | - | @@ -143,7 +143,7 @@ | -- | -- | -- |-- |-- | -- | |key | 主要用在 Vue 的虚拟 DOM 算法，在新旧 nodes 对比时辨识 VNodes [详情](https://cn.vuejs.org/v2/api/#key) |√ | √ | √ |App端旧版不支持表达式 | |ref | ref 被用来给元素或子组件注册引用信息 [详情](https://cn.vuejs.org/v2/api/#ref) |√ | √ | √ | | -|is | 用于动态组件且基于 DOM 内模板的限制来工作 [详情](https://cn.vuejs.org/v2/api/#is) |√ | √ | x | | +|is | 用于动态组件且基于 DOM 内模板的限制来工作 [详情](https://cn.vuejs.org/v2/api/#is) |√ | √ | x | - | @@ -159,7 +159,7 @@ |transition | 作为单个元素/组件的过渡效果 [详情](https://cn.vuejs.org/v2/api/#transition) |√ | x | x | | |transition-group | 作为多个元素/组件的过渡效果 [详情](https://cn.vuejs.org/v2/api/#transition-group) |√ | x | x | | |keep-alive | 包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们 [详情](https://cn.vuejs.org/v2/api/#keep-alive) |√ |x | x | | -|slot | 作为组件模板之中的内容分发插槽 [详情](https://cn.vuejs.org/v2/api/#slot) |√ | √ | √ | | +|slot | 作为组件模板之中的内容分发插槽 [详情](https://cn.vuejs.org/v2/api/#slot) |√ | √ | √ | - | @@ -228,7 +228,7 @@ uni-app 内置了 [Vuex](https://vuex.vuejs.org/zh/) ，在app里的使用，可 ``` -### 4. 组件属性设置不生效解决办法 +### 4. 组件属性设置不生效解决办法@componentsolutions 当重复设置某些属性为相同的值时，不会同步到view层。 例如：每次将scroll-view组件的scroll-top属性值设置为0，只有第一次能顺利返回顶部。 这和props的单向数据流特性有关，组件内部scroll-top的实际值改动后，其绑定的属性并不会一同变化。 diff --git a/docs/vue-basics.md b/docs/vue-basics.md index 91ed1f56d17759ac2fc9f6713add5074e74b0621..c3a575bc1eea947cdeaa9b1a9da28a99208bd31a 100644 --- a/docs/vue-basics.md +++ b/docs/vue-basics.md @@ -13,7 +13,7 @@ Vue.js 使用了基于 HTML 的模板语法，允许开发者声明式地将 DOM Vue.js 的核心是一个允许采用简洁的模板语法来声明式地将数据渲染进 DOM 的系统，只关注视图层，易于上手。所有东西都是响应式的。 -我们提供了免费视频教程，在看此文档同时建议结合[**vue入门视频教程**](https://learning.dcloud.io/#/?vid=1)，帮助你更加快速掌握。 +我们提供了免费视频教程，在看此文档同时建议结合 [vue入门视频教程](https://learning.dcloud.io/#/?vid=1) ，帮助你更加快速掌握。 @@ -24,9 +24,9 @@ Vue.js 的核心是一个允许采用简洁的模板语法来声明式地将数 ## vue相比传统js的开发优势 -在传统开发中，用原生的JavaScript DOM操作函数对DOM进行频繁操作的时候，浏览器要不停的渲染新的DOM树，导致页面看起来非常卡顿。 +在传统开发中，用原生的 JavaScript DOM 操作函数对 DOM 进行频繁操作的时候，浏览器要不停的渲染新的 DOM 树，导致页面看起来非常卡顿。 -vue是单页面应用，使页面局部刷新，不用每次跳转页面都要请求所有数据和dom，这样大大加快了访问速度和提升用户体验。 +vue 是单页面应用，使页面局部刷新，不用每次跳转页面都要请求所有数据和 DOM ，这样大大加快了访问速度和提升用户体验。 @@ -80,12 +80,9 @@ vue是单页面应用，使页面局部刷新，不用每次跳转页面都要 - ``` @@ -164,7 +161,7 @@ vue是单页面应用，使页面局部刷新，不用每次跳转页面都要 ### js的变化 -- 以前的dom操作，如果你想改变某个dom元素的显示内容，比如一个view的显示文字：给view设id，然后js里通过选择器获取dom元素，进一步通过js进行赋值操作，修改dom元素的属性或值。 +- 以前的 DOM 操作，如果你想改变某个 DOM 元素的显示内容，比如一个view的显示文字：给view设id，然后js里通过选择器获取 DOM 元素，进一步通过js进行赋值操作，修改 DOM 元素的属性或值。 ```html @@ -186,9 +183,9 @@ vue是单页面应用，使页面局部刷新，不用每次跳转页面都要 ``` -- 现在的做法，是vue的绑定模式，给这个dom元素绑定一个js变量，在script中修改js变量的值，dom会自动变化，页面会自动更新渲染。 +- 现在的做法，是vue的绑定模式，给这个 DOM 元素绑定一个js变量，在script中修改js变量的值，DOM 会自动变化，页面会自动更新渲染。 - 前端改用 [MVVM](https://baike.baidu.com/item/MVVM/96310?fr=aladdin) (Model-View-ViewModel的简写)模式，简单来说，Model:代表数据模型，View:只专注视图UI处理，ViewModel:只处理业务和数据。它的核心是 MVVM 中的 VM，也就是 ViewModel。 ViewModel负责连接 View 和 Model，保证视图和数据的一致性，这种轻量级的架构让前端开发更加高效、便捷，大幅减少代码行数，同时差量渲染性能更好。 - - `uni-app` 使用vue的数据绑定方式解决js和dom界面交互的问题。 + - `uni-app` 使用vue的数据绑定方式解决js和 DOM 界面交互的问题。 ```html @@ -221,10 +218,6 @@ vue是单页面应用，使页面局部刷新，不用每次跳转页面都要 - - - - ## 模板语法 @@ -286,7 +279,7 @@ vue是单页面应用，使页面局部刷新，不用每次跳转页面都要 ``` -如果 `isButtonDisabled` 的值是 `null` 、`undefined` 或 `false` ，则 disabled 甚至不会被包含在渲染出来的 button 元素中。 +如果 `isButtonDisabled` 的值是 `null` 、`undefined` 或 `false` ，则 `disabled` 甚至不会被包含在渲染出来的 `button` 元素中。 #### v-on @@ -307,7 +300,7 @@ v-on 指令，它用于监听 DOM 事件。v-on缩写为‘ @ ’ 只渲染元素和组件一次。随后的重新渲染，元素/组件及其所有的子节点将被视为静态内容并跳过。 -和前端框架中的理解不同，客户端里要实现复用的逻辑，会标记模板节点的状态，添加了 v-once 能保证节点只渲染一次，但是并不一定能优化渲染性能，反而可能会拖慢客户端复用节点时的比对效率。 +和前端框架中的理解不同，客户端里要实现复用的逻辑，会标记模板节点的状态，添加了 `v-once` 能保证节点只渲染一次，但是并不一定能优化渲染性能，反而可能会拖慢客户端复用节点时的比对效率。 > h5、微信小程序均不支持 @@ -323,7 +316,7 @@ v-on 指令，它用于监听 DOM 事件。v-on缩写为‘ @ ’ #### v-html -更新元素的 innerHTML。 +更新元素的 `innerHTML` 。 - 注意：**内容按普通 HTML 插入 - 不会作为 Vue 模板进行编译。** - 如果试图使用 v-html 组合模板，可以重新考虑是否通过使用组件来替代。 @@ -438,7 +431,7 @@ data 必须声明为返回一个初始数据对象的函数（注意函数内返 ``` -当 isActive 或者 hasError 变化时，class 列表将相应地更新。例如，如果 hasError 的值为 true，class 列表将变为 "static active text-danger"。 +当 `isActive` 或者 `hasError` 变化时，class 列表将相应地更新。例如，如果 `hasError` 的值为 `true` ，class 列表将变为 `static active text-danger`。 @@ -489,7 +482,7 @@ data 必须声明为返回一个初始数据对象的函数（注意函数内返 **注意：以:style=""这样的方式设置px像素值，其值为实际像素，不会被编译器转换。** -> 非H5端不支持 classObject 和 styleObject 语法。 +> 非H5端不支持 `classObject` 和 `styleObject` 语法。 不支持示例： @@ -589,7 +582,7 @@ data 必须声明为返回一个初始数据对象的函数（注意函数内返 ``` -类似于 v-else，v-else-if 也必须紧跟在带 v-if 或者 v-else-if 的元素之后。 +类似于 `v-else` ，`v-else-if` 也必须紧跟在带 `v-if` 或者 `v-else-if` 的元素之后。 @@ -620,7 +613,7 @@ data 必须声明为返回一个初始数据对象的函数（注意函数内返 -### v-if和v-show区别 +### v-if 和 v-show 区别 `v-if` 是“真正”的条件渲染，因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。 @@ -636,8 +629,8 @@ data 必须声明为返回一个初始数据对象的函数（注意函数内返 **注意** -- 不推荐同时使用 v-if 和 v-for。 -- 当 v-if 与 v-for 一起使用时，v-for 具有比 v-if 更高的优先级。 +- 不推荐同时使用 `v-if` 和 `v-for`。 +- 当 `v-if` 与 `v-for` 一起使用时，`v-for` 具有比 `v-if` 更高的优先级。 @@ -650,7 +643,7 @@ data 必须声明为返回一个初始数据对象的函数（注意函数内返 v-for 指令可以实现基于一个数组来渲染一个列表。 -- v-for 指令需要使用 `item in items` 形式的特殊语法，其中 `items` 是源数据数组，而 `item` 则是被迭代的数组元素的别名。 +- `v-for` 指令需要使用 `item in items` 形式的特殊语法，其中 `items` 是源数据数组，而 `item` 则是被迭代的数组元素的别名。 - 第一个参数 `item` 则是被迭代的数组元素的别名。 - 第二个参数，即当前项的索引 `index` ，是可选的。 @@ -727,7 +720,7 @@ v-for 指令可以实现基于一个数组来渲染一个列表。 ### 列表渲染分组 -类似于 v-if，你也可以利用带有 v-for 的 `template` 来循环渲染一段包含多个元素的内容。比如： +类似于 `v-if`，你也可以利用带有 `v-for` 的 `template` 来循环渲染一段包含多个元素的内容。比如： ```html