vue篇：el挂载点和data数据对象

时间:2022-07-22
本文章向大家介绍vue篇：el挂载点和data数据对象，主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项，具有一定的参考价值，需要的朋友可以参考一下。

vue篇：el挂载点和data数据对象

el是用来设置vue实例挂载（管理）的元素。 vue实例的作用范围：vue会管理el选项命中的元素及其内部的后代元素 可以使用其他的选择器，但是推荐使用id选择器 可以使用除div之外的其他双标签，但是不能使用html和body标签。

vue中用到的数据定义在data中 data可以写复杂类型的数据 渲染复杂类型数据时，遵守js的语法即可。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>el挂载点和data数据对象</title>
    </head>
    <body>
        <div id="app">
            {{message}}
            {{home.name}}
            {{home.tell}}
            <ul>
                <li>{{classmate[0]}}</li>
                <li>{{classmate[1]}}</li>
            </ul>
        </div>
        <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
        <script type="text/javascript">
            var app = new Vue({
                el:"#app",
                data:{
                    message:"你好，乐心湖",
                    home:{
                        name:"广东",
                        tell:138
                    },
                    classmate:["心","湖"]
                }
            })
        </script>
    </body>
</html>

随机文章
Javascript知识点必读
最近更新