您的位置：首页 > 产品设计 > UI/UE

vue指令的定义及常用指令

2017-03-16 00:56 405 查看

1.指令的定义: 扩展html标签功能,属性

常用指令:

angular:

ng-model   ng-controller

ng-repeat

ng-click

ng-show

Vue：

v-model 一般表单元素(input) 双向数据绑定

vue循环:

   数据库遍历

v-for="name in arr"

{{name}}{{$index}}

Json遍历1

v-for="name in json"

{{name}}{{$index}} {{$key}}

   Json遍历2

v-for="(k,v) in json"

         {{name}}{{$index}} {{$key}}

Eg:<script>

        window.onload=function(){

            new Vue({

                el:'#box',

                data:{

                    arr:['apple','banana','orange','pear'],

                    json:{a:'apple',b:'banana',c:'orange'}

                }

            });

        };

    </script>

</head>

<body>

    <div id="box">

        <ul>

            <li v-for="value in arr">

                {{value}}   {{$index}}

            </li>

        </ul>

        <hr>

        <ul>

            <li v-for="value in json">

                {{value}}   {{$index}} {{$key}}

            </li>

        </ul>

        <hr>

        <ul>

            <li v-for="(k,v) in json">

                {{k}}   {{v}}   {{$index}} {{$key}}

            </li>

        </ul>

    </div>

</body>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航