Vue framework entry notes (1)

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script src="vue.js"></script>
        <script src="MyJs.js"></script>

        <style>
        </style>
    </head> 
    <body>
        <div id="Myapp">
            <ol>
                <game-item v-for="item in games" v-bind:game="item"></game-item>
            </ol>
            
        </div>
        <script>
            Vue.component("game-item", {
                props:["game"],     //自定义属性
                template:"<li>{{game.title}}</li>",
            });
            var vm=new Vue({
                el:"#Myapp",
                data:{
                    games:[
                        {title:"勇者斗恶龙"},
                        {title:"口袋妖怪"},
                        {title:"守望先锋"},
                    ]
                }
            })
        </script>
    </body>
</html>

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=324940281&siteId=291194637