前端学习(二)简单修改vue的项目内容

您所在的位置:网站首页 表情包里面的字怎么修改啊 前端学习(二)简单修改vue的项目内容

前端学习(二)简单修改vue的项目内容

2024-07-10 17:23| 来源: 网络整理| 查看: 265

上一篇把框架搭建起来了,这篇就修改一下框架的内容,看看效果。 稍微查了下资料,知道vue框架的代码入口是“App.vue(style模块没变化,这里就不贴出来了)”:

import HelloWorld from './components/HelloWorld.vue' export default { name: 'App', components: { HelloWorld } }

所以这里我们可以想到,想要修改这个页面的内容,可以在两个地方改,一个是直接在App.vue的“template”里加,也可以去HelloWorld 里面加。 首先可以试试在App.vue里加:

测试添加内容 import HelloWorld from './components/HelloWorld.vue' export default { name: 'App', components: { HelloWorld } }

在这里插入图片描述 可以看到页面上显示了,只是这个位置不符合预期,不过先不管他,以后学到再说。 现在再去HelloWorld.vue 中改,改之前要把刚才加的那一句话删掉,不要影响我们测试。

测试添加内容2 {{ msg }}

由于篇幅,这里只粘贴前后几行,这里就是HelloWorld.vue的前五行,下面内容都是没改动的。 在这里插入图片描述 可以看到也生效。到这里可以发现稍微懂一点前端,想要改一些简单的东西还是不难的。

这篇就是很基础的东西,主要是帮助理解vue框架的代码从哪进入,该修改哪里。



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3