Vue从入门到精通

最新推荐文章于 2024-07-25 11:52:08 发布

haoyue1014

最新推荐文章于 2024-07-25 11:52:08 发布

阅读量139

点赞数

分类专栏： Vue html 前端文章标签： vue html web前端

本文链接：https://blog.csdn.net/haoyue1014/article/details/100918983

版权

html 同时被 3 个专栏收录

3 篇文章 0 订阅

订阅专栏

Vue

1 篇文章 0 订阅

订阅专栏

前端

1 篇文章 0 订阅

订阅专栏

一、获取vue.js

1、安装node，在dos目录下输入npm install vue，然后在下载的node_modules\vue\dist目录下找到vue.js

2、新建index.htm文件，完成以下三步：

（1）留坑

（2）引入vue.js

（3）实例化vue对象


new Vue({
    el:"#app"
})

完整代码如下：

<!DOCTYPE html>
<html>
    <head>
        <title>Hello VUE</title>
    </head>
    <body>
        <div id="app"></div>
        <script src="vue.js"></script>
        <script>
            new Vue({
                el:"#app",
                template:`
                    <div>
                        <div>hello vue</div>
                        <div>{{message}}</div>
                    </div>
                `,
                data:function(){
                    return {
                        message:"我是Vue"
                    }
                }
            })
</script>
    </body>
</html>

Vue从入门到精通系列文章，目录如下：

文章列表

扫码关注公众号，获取全部文章列表和实时更新。

haoyue1014

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Vue从入门到精通

一、获取vue.js1、安装node，在dos目录下输入npminstall vue，然后在下载的node_modules\vue\dist目录下找到vue.js2、新建index.htm文件，完成以下三步：（1）留坑<divid="app"></div>（2）引入vue.js<scriptsrc="vue.js"></scr...
复制链接

扫一扫

专栏目录