js如何实现侧边广告_如何用VSCode实现一个vue.js项目？

1,新建项目

• 打开Visual studio code
• 打开一个你想要创建项目的文件夹
• 打开集成终端：

  查看 –> 集成终端

  或者直接按 ctrl+\ `

如果没有安装vue-cli，在终端输入：

npm install \-g vue-cli

全局安装vue-cli

然后新建项目

projectName换为你想要的名字。这里我建立的项目名为 ex1

然后一直按确认或输入y按确认，等待项目初始化，如下图

项目完成后，运行如下命令

此时，打开你最喜欢的浏览器，输入上图的地址

你应该能看到下图所显示的

2.完成项目

这时，你的项目的目录结构应该如下图所示

我们目前只关心目录src文件下的内容

接下来我们将vue.js官网的树形视图例子整合到我们的项目中。

• "open" v-if=

"isFolder">        class= "item"

        v-for= "(child, index) in model.children"

        :key= "index"

        :model= "child">"add" @click= "addChild">+

4) app.vue的代码如下：

"app">

"data">

如果一切正常，运行结果应该如下图

全部展开后如下图:

如果不喜欢将全部代码放在一个文件里面，可以在tree目录下新建两个文件

然后把tree.vue中包含在template里面的代码剪切进tree.html

，把style里面的但剪切进tree.css 。

然后tree.vue的template和style部分分别变为如下