24
2020
08

列举vue的常见指令。

    1.文本插值:{{}} Mustache

        <div id='app'>

            {{message}}

        </div>

    2.DOM属性绑定:v-bind

        <div id='app-2'>

            <span v-bind:title='message'>

                鼠标悬停几秒钟查看此处动态绑定的提示信息

            </span>

        </div>

    3.指令绑定一个事件监听器:v-on

        <div id='app-5'>

            <p>{{message}}</p>

            <button v-on:click='reverseMessage'>逆转消息</button>

        </div>

    4.实现表单输入和应用状态之间的双向绑定:v-model

        <div id='app-6'>

            <p>{{message}}</p>

            <input v-model='message'>

        </div>

    5.控制切换一个元素的显示:v-if和v-else

        <div id='app-3'>

            <p v-if='seen'>现在你看到我了</p>

        </div>

    6.列表渲染:v-for

        <div id='app-4'>

            <ol>

                <li v-for='todo in todos'>

                    {{todo.text}}

                </li>

            </ol>

« 上一篇 下一篇 »

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。