mirror of
https://github.com/jaywcjlove/reference.git
synced 2025-06-17 12:41:20 +08:00
doc: update vue2.md. (#5) 078df00bf5
This commit is contained in:
jaywcjlove
@ -43,7 +43,10 @@
|
||||
<li><a href="https://v2.cn.vuejs.org/">Vue 2.x 官方文档</a></li>
|
||||
<li><a href="https://v3.router.vuejs.org/">Vue Router 3.x 官方文档</a></li>
|
||||
</ul>
|
||||
</div></div></div><div class="wrap"><div class="wrap-header h3wrap"><h3 id="声明式渲染"><a aria-hidden="true" tabindex="-1" href="#声明式渲染"><span class="icon icon-link"></span></a>声明式渲染</h3><div class="wrap-body">
|
||||
</div></div><div class="h3wrap-body"><div class="wrap"><div class="wrap-header h4wrap"><h4 id="快速创建-vue-项目-vue-cli"><a aria-hidden="true" tabindex="-1" href="#快速创建-vue-项目-vue-cli"><span class="icon icon-link"></span></a>快速创建 <strong>Vue</strong> 项目 (<a href="https://cli.vuejs.org/zh/guide/creating-a-project.html">Vue CLI</a>)</h4><div class="wrap-body">
|
||||
<pre class="language-bash"><code class="language-bash code-highlight"><span class="code-line">npx @vue/cli create hello-world
|
||||
</span></code></pre>
|
||||
</div></div></div></div></div><div class="wrap"><div class="wrap-header h3wrap"><h3 id="声明式渲染"><a aria-hidden="true" tabindex="-1" href="#声明式渲染"><span class="icon icon-link"></span></a>声明式渲染</h3><div class="wrap-body">
|
||||
<pre class="language-html"><code class="language-html code-highlight"><span class="code-line"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>app<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
|
||||
</span><span class="code-line"> {{ message }}
|
||||
</span><span class="code-line"><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span>
|
||||
@ -995,7 +998,7 @@
|
||||
|
||||
|
||||
|
||||
<table><thead><tr><th align="left">:-</th><th align="left">:-</th></tr></thead><tbody><tr><td align="left"><code>vm.$data</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#vm-data">#</a></td></tr><tr><td align="left"><code>vm.$props</code> <em>(2.2.0)</em></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#vm-props">#</a></td></tr><tr><td align="left"><code>vm.$el</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#vm-el">#</a></td></tr><tr><td align="left"><code>vm.$options</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#vm-options">#</a></td></tr><tr><td align="left"><code>vm.$parent</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#vm-parent">#</a></td></tr><tr><td align="left"><code>vm.$root</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#vm-root">#</a></td></tr><tr><td align="left"><code>vm.$children</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#vm-children">#</a></td></tr><tr><td align="left"><code>vm.$slots</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#vm-slots">#</a></td></tr><tr><td align="left"><code>vm.$scopedSlots</code> <em>(2.1.0)</em></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#vm-scopedSlots">#</a></td></tr><tr><td align="left"><code>vm.$refs</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#vm-refs">#</a></td></tr><tr><td align="left"><code>vm.$isServer</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#vm-isServer">#</a></td></tr><tr><td align="left"><code>vm.$attrs</code> <em>(2.4.0)</em></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#vm-attrs">#</a></td></tr><tr><td align="left"><code>vm.$listeners</code> <em>(2.4.0)</em></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#vm-listeners">#</a></td></tr></tbody></table>
|
||||
<table><thead><tr><th align="left">:-</th><th align="left">:-</th></tr></thead><tbody><tr><td align="left"><code>vm.$data</code></td><td align="left">观察的数据对象 <a href="https://v2.cn.vuejs.org/v2/api/#vm-data">#</a></td></tr><tr><td align="left"><code>vm.$props</code> <em>(2.2.0)</em></td><td align="left">组件接收的 props 对象 <a href="https://v2.cn.vuejs.org/v2/api/#vm-props">#</a></td></tr><tr><td align="left"><code>vm.$el</code></td><td align="left">实例使用的根 DOM 元素 <a href="https://v2.cn.vuejs.org/v2/api/#vm-el">#</a></td></tr><tr><td align="left"><code>vm.$options</code></td><td align="left">实例的初始化选项 <a href="https://v2.cn.vuejs.org/v2/api/#vm-options">#</a></td></tr><tr><td align="left"><code>vm.$parent</code></td><td align="left">父实例 <a href="https://v2.cn.vuejs.org/v2/api/#vm-parent">#</a></td></tr><tr><td align="left"><code>vm.$root</code></td><td align="left">当前组件树的根实例 <a href="https://v2.cn.vuejs.org/v2/api/#vm-root">#</a></td></tr><tr><td align="left"><code>vm.$children</code></td><td align="left">当前实例的直接子组件 <a href="https://v2.cn.vuejs.org/v2/api/#vm-children">#</a></td></tr><tr><td align="left"><code>vm.$slots</code></td><td align="left">访问被插槽分发的内容 <a href="https://v2.cn.vuejs.org/v2/api/#vm-slots">#</a></td></tr><tr><td align="left"><code>vm.$scopedSlots</code> <em>(2.1.0)</em></td><td align="left">访问作用域插槽 <a href="https://v2.cn.vuejs.org/v2/api/#vm-scopedSlots">#</a></td></tr><tr><td align="left"><code>vm.$refs</code></td><td align="left">DOM 元素和组件实例 <a href="https://v2.cn.vuejs.org/v2/api/#vm-refs">#</a></td></tr><tr><td align="left"><code>vm.$isServer</code></td><td align="left">是否运行于服务器 <a href="https://v2.cn.vuejs.org/v2/api/#vm-isServer">#</a></td></tr><tr><td align="left"><code>vm.$attrs</code> <em>(2.4.0)</em></td><td align="left">包含父作用域中不作为 prop 被识别的属性绑定 ( <a href="https://v2.cn.vuejs.org/v2/api/#vm-attrs">#</a></td></tr><tr><td align="left"><code>vm.$listeners</code> <em>(2.4.0)</em></td><td align="left">包含了父作用域中的 (不含 .native 修饰器的) <code>v-on</code> 事件监听器 <a href="https://v2.cn.vuejs.org/v2/api/#vm-listeners">#</a></td></tr></tbody></table>
|
||||
</div></div></div><div class="wrap"><div class="wrap-header h3wrap"><h3 id="实例方法--事件"><a aria-hidden="true" tabindex="-1" href="#实例方法--事件"><span class="icon icon-link"></span></a>实例方法 / 事件</h3><div class="wrap-body">
|
||||
|
||||
|
||||
@ -1117,7 +1120,7 @@
|
||||
|
||||
|
||||
|
||||
<table><thead><tr><th align="left">:-</th><th align="left">:-</th></tr></thead><tbody><tr><td align="left"><code>v-text</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#v-text">#</a></td></tr><tr><td align="left"><code>v-html</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#v-html">#</a></td></tr><tr><td align="left"><code>v-show</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#v-show">#</a></td></tr><tr><td align="left"><code>v-if</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#v-if">#</a></td></tr><tr><td align="left"><code>v-else</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#v-else">#</a></td></tr><tr><td align="left"><code>v-else-if</code> <em>(2.1.0)</em></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#v-else-if">#</a></td></tr><tr><td align="left"><code>v-for</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#v-for">#</a></td></tr><tr><td align="left"><code>v-on</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#v-on">#</a></td></tr><tr><td align="left"><code>v-bind</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#v-bind">#</a></td></tr><tr><td align="left"><code>v-model</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#v-model">#</a></td></tr><tr><td align="left"><code>v-slot</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#v-slot">#</a></td></tr><tr><td align="left"><code>v-pre</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#v-pre">#</a></td></tr><tr><td align="left"><code>v-cloak</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#v-cloak">#</a></td></tr><tr><td align="left"><code>v-once</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#v-once">#</a></td></tr></tbody></table>
|
||||
<table><thead><tr><th align="left">:-</th><th align="left">:-</th></tr></thead><tbody><tr><td align="left"><code>v-text</code></td><td align="left">更新元素的 <code>textContent</code> <a href="https://v2.cn.vuejs.org/v2/api/#v-text">#</a></td></tr><tr><td align="left"><code>v-html</code></td><td align="left">更新元素的 <code>innerHTML</code> <a href="https://v2.cn.vuejs.org/v2/api/#v-html">#</a></td></tr><tr><td align="left"><code>v-show</code></td><td align="left">切换元素的 <code>display</code> css 属性 <a href="https://v2.cn.vuejs.org/v2/api/#v-show">#</a></td></tr><tr><td align="left"><code>v-if</code></td><td align="left">有条件地渲染元素 <a href="https://v2.cn.vuejs.org/v2/api/#v-if">#</a></td></tr><tr><td align="left"><code>v-else</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#v-else">#</a></td></tr><tr><td align="left"><code>v-else-if</code> <em>(2.1.0)</em></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#v-else-if">#</a></td></tr><tr><td align="left"><code>v-for</code></td><td align="left">多次渲染元素或模板块 <a href="https://v2.cn.vuejs.org/v2/api/#v-for">#</a></td></tr><tr><td align="left"><code>v-on</code></td><td align="left">绑定事件监听器 <a href="https://v2.cn.vuejs.org/v2/api/#v-on">#</a></td></tr><tr><td align="left"><code>v-bind</code></td><td align="left">动态地绑定一个或多个属性 <a href="https://v2.cn.vuejs.org/v2/api/#v-bind">#</a></td></tr><tr><td align="left"><code>v-model</code></td><td align="left">创建双向绑定 <a href="https://v2.cn.vuejs.org/v2/api/#v-model">#</a></td></tr><tr><td align="left"><code>v-slot</code></td><td align="left">提供插槽或接收 prop 的插槽 <a href="https://v2.cn.vuejs.org/v2/api/#v-slot">#</a></td></tr><tr><td align="left"><code>v-pre</code></td><td align="left">跳过元素和它的子元素编译过程 <a href="https://v2.cn.vuejs.org/v2/api/#v-pre">#</a></td></tr><tr><td align="left"><code>v-cloak</code></td><td align="left">保持在元素上直到实例结束编译 <a href="https://v2.cn.vuejs.org/v2/api/#v-cloak">#</a></td></tr><tr><td align="left"><code>v-once</code></td><td align="left">只渲染元素和组件一次 <a href="https://v2.cn.vuejs.org/v2/api/#v-once">#</a></td></tr></tbody></table>
|
||||
</div></div></div><div class="wrap"><div class="wrap-header h3wrap"><h3 id="特殊-attribute"><a aria-hidden="true" tabindex="-1" href="#特殊-attribute"><span class="icon icon-link"></span></a>特殊 attribute</h3><div class="wrap-body">
|
||||
|
||||
|
||||
@ -1152,7 +1155,7 @@
|
||||
|
||||
|
||||
|
||||
<table><thead><tr><th align="left">:-</th><th align="left">:-</th></tr></thead><tbody><tr><td align="left"><code>key</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#key">#</a></td></tr><tr><td align="left"><code>ref</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#ref">#</a></td></tr><tr><td align="left"><code>is</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#is">#</a></td></tr><tr><td align="left"><del><code>slot</code></del></td><td align="left">推荐 2.6.0 新增的 <code>v-slot</code> <a href="https://v2.cn.vuejs.org/v2/api/#slot-%E5%BA%9F%E5%BC%83">#</a></td></tr><tr><td align="left"><del><code>slot-scope</code></del></td><td align="left">推荐 2.6.0 新增的 <code>v-slot</code> <a href="https://v2.cn.vuejs.org/v2/api/#slot-scope-%E5%BA%9F%E5%BC%83">#</a></td></tr><tr><td align="left"><del><code>scope</code></del></td><td align="left"><code>2.5.0</code> 新增的 <code>slot-scope</code> 取代 <a href="https://v2.cn.vuejs.org/v2/api/#scope-%E7%A7%BB%E9%99%A4">#</a></td></tr></tbody></table>
|
||||
<table><thead><tr><th align="left">:-</th><th align="left">:-</th></tr></thead><tbody><tr><td align="left"><code>key</code></td><td align="left">用在 Vue 的虚拟 DOM 算法 <a href="https://v2.cn.vuejs.org/v2/api/#key">#</a></td></tr><tr><td align="left"><code>ref</code></td><td align="left">元素或子组件注册引用信息 <a href="https://v2.cn.vuejs.org/v2/api/#ref">#</a></td></tr><tr><td align="left"><code>is</code></td><td align="left">限制是否更新 <a href="https://v2.cn.vuejs.org/v2/api/#is">#</a></td></tr><tr><td align="left"><del><code>slot</code></del></td><td align="left">推荐 2.6.0 新增的 <code>v-slot</code> <a href="https://v2.cn.vuejs.org/v2/api/#slot-%E5%BA%9F%E5%BC%83">#</a></td></tr><tr><td align="left"><del><code>slot-scope</code></del></td><td align="left">推荐 2.6.0 新增的 <code>v-slot</code> <a href="https://v2.cn.vuejs.org/v2/api/#slot-scope-%E5%BA%9F%E5%BC%83">#</a></td></tr><tr><td align="left"><del><code>scope</code></del></td><td align="left"><code>2.5.0</code> 新增的 <code>slot-scope</code> 取代 <a href="https://v2.cn.vuejs.org/v2/api/#scope-%E7%A7%BB%E9%99%A4">#</a></td></tr></tbody></table>
|
||||
</div></div></div><div class="wrap"><div class="wrap-header h3wrap"><h3 id="内置的组件"><a aria-hidden="true" tabindex="-1" href="#内置的组件"><span class="icon icon-link"></span></a>内置的组件</h3><div class="wrap-body">
|
||||
|
||||
|
||||
@ -1183,7 +1186,7 @@
|
||||
|
||||
|
||||
|
||||
<table><thead><tr><th align="left">:-</th><th align="left">:-</th></tr></thead><tbody><tr><td align="left"><code>component</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#component">#</a></td></tr><tr><td align="left"><code>transition</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#transition">#</a></td></tr><tr><td align="left"><code>transition-group</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#transition-group">#</a></td></tr><tr><td align="left"><code>keep-alive</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#keep-alive">#</a></td></tr><tr><td align="left"><code>slot</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/api/#slot">#</a></td></tr></tbody></table>
|
||||
<table><thead><tr><th align="left">:-</th><th align="left">:-</th></tr></thead><tbody><tr><td align="left"><code><component></code></td><td align="left">渲染一个<code>元组件</code>为动态组件 <a href="https://v2.cn.vuejs.org/v2/api/#component">#</a></td></tr><tr><td align="left"><code><transition></code></td><td align="left">单个元素/组件的过渡效果 <a href="https://v2.cn.vuejs.org/v2/api/#transition">#</a></td></tr><tr><td align="left"><code><transition-group></code></td><td align="left">多个元素/组件的过渡效果 <a href="https://v2.cn.vuejs.org/v2/api/#transition-group">#</a></td></tr><tr><td align="left"><code><keep-alive></code></td><td align="left">不活动的实例缓存不销毁 <a href="https://v2.cn.vuejs.org/v2/api/#keep-alive">#</a></td></tr><tr><td align="left"><code><slot></code></td><td align="left">组件模板中的内容分发插槽 <a href="https://v2.cn.vuejs.org/v2/api/#slot">#</a></td></tr></tbody></table>
|
||||
</div></div></div><div class="wrap row-span-2"><div class="wrap-header h3wrap"><h3 id="v-on-事件修饰符"><a aria-hidden="true" tabindex="-1" href="#v-on-事件修饰符"><span class="icon icon-link"></span></a>v-on (事件)修饰符</h3><div class="wrap-body">
|
||||
<!--rehype:wrap-class=row-span-2-->
|
||||
|
||||
|
||||
Reference in New Issue
Block a user