Hello World 项目起步

最新推荐文章于 2022-10-02 02:36:00 发布

娜小鈊

最新推荐文章于 2022-10-02 02:36:00 发布

阅读量200

点赞数

分类专栏： vue

本文链接：https://blog.csdn.net/weixin_39366606/article/details/100740357

版权

vue 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

{{}}：模板，用来进行数据绑定显示在页面中。

el：挂载DOM元素，id为itany，则是"#itany"，class为itany，则是".itany"

vue实例不能挂载到HTML和body上

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" charset="utf-8" src="../js/vue.js"></script>
</head>
<body>
    <div id="itany">{{message}}</div>
    <script type="text/javascript">
        Vue.config.devtools = true;
        Vue.config.productionTip = false;
        new Vue({
            el:'#itany',
            data:{
                message:"Hello World"
            }
        });
    </script>
</body>
</html>

若script标签在HTML上，则需要

window.onload=function(){
    new Vue({
        ...
    });
}

Vue.config.devtools = true
Vue.config.productionTip = false

以上两行代码为Vue的全局配置

Vue.config.devtools = true ：默认为true，配置是否允许vue-devtools检查代码，生产环境中需要设置false。

Vue.config.productionTip = false ：阻止Vue启动时生成生产消息

娜小鈊

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Hello World 项目起步

{{}}：模板，用来进行数据绑定显示在页面中。el：挂载DOM元素，id为itany，则是"#itany"，class为itany，则是".itany" vue实例不能挂载到HTML和body上<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"&gt...
复制链接

扫一扫

专栏目录