buyfakett/reference
1
0
Fork 0
mirror of https://github.com/jaywcjlove/reference.git synced 2025-06-17 20:51:21 +08:00
Code Issues Packages Projects Releases Wiki Activity

doc: update vue2.md. (#5) f55c4219c4

Browse Source
This commit is contained in:
jaywcjlove
2022-10-10 16:52:40 +00:00
parent 6738b2bc96
commit c600266cca
1 changed files with 167 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

167
docs/vue2.html
View File

@ -967,6 +967,173 @@
<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>
</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-->
<table class="style-list"><thead><tr><th align="left">:-</th><th align="left">:-</th></tr></thead><tbody><tr><td align="left"><code>v-on:click.stop</code> <a href="https://v2.cn.vuejs.org/v2/api/#v-on">#</a></td><td align="left">调用 event.stopPropagation()。</td></tr><tr><td align="left"><code>v-on:click.prevent</code> <a href="https://v2.cn.vuejs.org/v2/api/#v-on">#</a></td><td align="left">调用 event.preventDefault()。</td></tr><tr><td align="left"><code>v-on:click.capture</code> <a href="https://v2.cn.vuejs.org/v2/api/#v-on">#</a></td><td align="left">添加事件侦听器时使用 capture 模式。</td></tr><tr><td align="left"><code>v-on:click.self</code> <a href="https://v2.cn.vuejs.org/v2/api/#v-on">#</a></td><td align="left">只当事件是从侦听器绑定的元素本身触发时才触发回调。</td></tr><tr><td align="left"><code>v-on:click.{keyCode|keyAlias}</code> <a href="https://v2.cn.vuejs.org/v2/api/#v-on">#</a></td><td align="left">只当事件是从特定键触发时才触发回调。</td></tr><tr><td align="left"><code>v-on:click.native</code> <a href="https://v2.cn.vuejs.org/v2/api/#v-on">#</a></td><td align="left">监听组件根元素的原生事件。</td></tr><tr><td align="left"><code>v-on:click.once</code> <a href="https://v2.cn.vuejs.org/v2/api/#v-on">#</a></td><td align="left">只触发一次回调。</td></tr><tr><td align="left"><code>v-on:click.passive</code> <em>(2.3.0)</em> <a href="https://v2.cn.vuejs.org/v2/api/#v-on">#</a></td><td align="left">以 { passive: true } 模式添加侦听器</td></tr></tbody></table>
<!--rehype:className=style-list-->
</div></div></div><div class="wrap"><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">
<table><thead><tr><th align="left">:-</th><th align="left">:-</th></tr></thead><tbody><tr><td align="left"><code>v-on:click.left</code> <a href="https://v2.cn.vuejs.org/v2/api/#v-on">#</a></td><td align="left">只当点击鼠标左键时触发</td></tr><tr><td align="left"><code>v-on:click.right</code> <a href="https://v2.cn.vuejs.org/v2/api/#v-on">#</a></td><td align="left">只当点击鼠标右键时触发</td></tr><tr><td align="left"><code>v-on:click.middle</code> <a href="https://v2.cn.vuejs.org/v2/api/#v-on">#</a></td><td align="left">只当点击鼠标中键时触发</td></tr></tbody></table>
<p>在 <em>(2.2.0)</em> 中新增</p>
</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">
<table><thead><tr><th align="left">:-</th><th align="left">:-</th></tr></thead><tbody><tr><td align="left"><code>v-on:keyup.ctrl</code> <em>(2.1.0)</em></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/guide/events.html#%E7%B3%BB%E7%BB%9F%E4%BF%AE%E9%A5%B0%E9%94%AE">#</a></td></tr><tr><td align="left"><code>v-on:keyup.alt</code> <em>(2.1.0)</em></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/guide/events.html#%E7%B3%BB%E7%BB%9F%E4%BF%AE%E9%A5%B0%E9%94%AE">#</a></td></tr><tr><td align="left"><code>v-on:keyup.shift</code> <em>(2.1.0)</em></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/guide/events.html#%E7%B3%BB%E7%BB%9F%E4%BF%AE%E9%A5%B0%E9%94%AE">#</a></td></tr><tr><td align="left"><code>v-on:keyup.meta</code> <em>(2.1.0)</em></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/guide/events.html#%E7%B3%BB%E7%BB%9F%E4%BF%AE%E9%A5%B0%E9%94%AE">#</a></td></tr></tbody></table>
</div></div></div><div class="wrap"><div class="wrap-header h3wrap"><h3 id="keyboard-按键修饰符"><a aria-hidden="true" tabindex="-1" href="#keyboard-按键修饰符"><span class="icon icon-link"></span></a>Keyboard 按键修饰符</h3><div class="wrap-body">
<table><thead><tr><th align="left">:-</th><th align="left">:-</th></tr></thead><tbody><tr><td align="left"><code>v-on:keyup.enter</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/guide/events.html#%E6%8C%89%E9%94%AE%E4%BF%AE%E9%A5%B0%E7%AC%A6">#</a></td></tr><tr><td align="left"><code>v-on:keyup.tab</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/guide/events.html#%E6%8C%89%E9%94%AE%E4%BF%AE%E9%A5%B0%E7%AC%A6">#</a></td></tr><tr><td align="left"><code>v-on:keyup.delete </code></td><td align="left">捕获“删除”和“退格”键 <a href="https://v2.cn.vuejs.org/v2/guide/events.html#%E6%8C%89%E9%94%AE%E4%BF%AE%E9%A5%B0%E7%AC%A6">#</a></td></tr><tr><td align="left"><code>v-on:keyup.esc</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/guide/events.html#%E6%8C%89%E9%94%AE%E4%BF%AE%E9%A5%B0%E7%AC%A6">#</a></td></tr><tr><td align="left"><code>v-on:keyup.space</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/guide/events.html#%E6%8C%89%E9%94%AE%E4%BF%AE%E9%A5%B0%E7%AC%A6">#</a></td></tr><tr><td align="left"><code>v-on:keyup.up</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/guide/events.html#%E6%8C%89%E9%94%AE%E4%BF%AE%E9%A5%B0%E7%AC%A6">#</a></td></tr><tr><td align="left"><code>v-on:keyup.down</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/guide/events.html#%E6%8C%89%E9%94%AE%E4%BF%AE%E9%A5%B0%E7%AC%A6">#</a></td></tr><tr><td align="left"><code>v-on:keyup.left</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/guide/events.html#%E6%8C%89%E9%94%AE%E4%BF%AE%E9%A5%B0%E7%AC%A6">#</a></td></tr><tr><td align="left"><code>v-on:keyup.right</code></td><td align="left"><a href="https://v2.cn.vuejs.org/v2/guide/events.html#%E6%8C%89%E9%94%AE%E4%BF%AE%E9%A5%B0%E7%AC%A6">#</a></td></tr></tbody></table>
</div></div></div><div class="wrap"><div class="wrap-header h3wrap"><h3 id="v-bind-修饰符"><a aria-hidden="true" tabindex="-1" href="#v-bind-修饰符"><span class="icon icon-link"></span></a>v-bind 修饰符</h3><div class="wrap-body">
<table class="style-list"><thead><tr><th align="left">:-</th><th align="left">:-</th></tr></thead><tbody><tr><td align="left"><code>v-bind.prop</code> <a href="https://v2.cn.vuejs.org/v2/api/#v-bind">#</a></td><td align="left">作为一个 DOM property 绑定而不是作为 attribute 绑定。(<a href="https://stackoverflow.com/questions/6003819/properties-and-attributes-in-html#answer-6004028">差别在哪里？</a>)</td></tr><tr><td align="left"><code>v-bind.camel</code> <em>(2.1.0+)</em> <a href="https://v2.cn.vuejs.org/v2/api/#v-bind">#</a></td><td align="left">将 kebab-case attribute 名转换为 camelCase。</td></tr><tr><td align="left"><code>v-bind.sync</code> <em>(2.3.0+)</em> <a href="https://v2.cn.vuejs.org/v2/api/#v-bind">#</a></td><td align="left">语法糖，会扩展成一个更新父组件绑定值的 v-on 侦听器。</td></tr></tbody></table>
<!--rehype:className=style-list-->
</div></div></div></div></div><div class="wrap"><div class="wrap-header h2wrap"><h2 id="另见"><a aria-hidden="true" tabindex="-1" href="#另见"><span class="icon icon-link"></span></a>另见</h2><div class="wrap-body">
<ul>
<li><a href="https://www.vuemastery.com/pdf/Vue-Essentials-Cheat-Sheet.pdf">Vue Essentials Cheat-Sheet.pdf</a> <em>(vuemastery.com)</em></li>