坑提示："The template root requires exactly one element"

　　　　Src下面有个App.vue文件，在index里引用了这个文件以后，我在.vue文件里添加了html，但是加完一个div以后，再加div就没效果了，百思不得其解。

　　　　

　　　　如图：

　　　　

　　　　div1能显示，但是div2死活不出来。知道今天我看见了一句提示：

　　　　

　　　  这句话的意思是模板只能有一个根节点！就是说.vue文件里，要有一个根节点div，里面再去包含1和2，就可以了。

　　　　

　　　　“试试效果”这个div和之前写的一个div被我放到一个根div里，然后页面就显示出来了。

　　　　这块vue之所以这样设计，应该是出于vue的特性，每个template都有一个单独的id，同时里面对应一个单独的、唯一的、根级别的div

　　　　

vue填坑指南之模板的使用的更多相关文章

  1. Kubernetes Fluentd＋Elasticsearch＋Kibana统一日志管理平台搭建的填坑指南

    在初步完成Kubernetes集群架构的建立后,通过搭建一些监控组件,我们已经能够实现 图形化的监控每个node,pod的状态信息和资源情况 通过scale进行replicateSet的扩展和伸缩 通 ...

  2. Flutter 开发填坑指南

    引言 第一次在使用Flutter是在Ubuntu机器上,但是因为Android Studio还有Sdk配置问题,flutter doctor总是在这一步报错...最近又在win10上配了一下环境(真香 ...

  3. Hive 填坑指南

    Hive 填坑指南 目录 Hive 填坑指南 数据表备份 数据表备份 方法1:create table 表名_new as select * from 原表 create table 表名_new a ...

  4. Vue填坑(1)----通过vue-cli，认识vue-router

    开始 首先,确保之前已经安装过 npm 和 nodejs(为了避免版本的问题,最好使用较新的版本). 全局安装 vue-cli : npm install -g vue-cli 新建文件夹 my-pr ...

  5. 微信支付中分账功能 填坑指南V1

    公司是做电商的,近期开发了一款小程序,准备线上线下同步销售玩具.这里就涉及到微信支付的功能,网上有很多教程,官方也有文档和Demo,因此微信支付还是比较容易实现的. 由于我们公司是和其他公司合作运营的 ...

  6. Hexo博客skapp主题部署填坑指南

    相信大家都很喜欢 hexo skapp 的主题,由于作者采用结巴分词,加上需要依赖各种各样的环境 所以可能大家踩过很多坑,也许每个人踩得坑不一样,这里使用 Docker 容器 centos 来部署, ...

  7. Python 装饰器填坑指南 | 最常见的报错信息、原因和解决方案

    本文为霍格沃兹测试学院学员学习笔记. Python 装饰器简介 装饰器(Decorator)是 Python 非常实用的一个语法糖功能.装饰器本质是一种返回值也是函数的函数,可以称之为“函数的函数”. ...

  8. Windows10系统下Hadoop和Hive开发环境搭建填坑指南

    前提 笔者目前需要搭建数据平台,发现了Windows系统下,Hadoop和Hive等组件的安装和运行存在大量的坑,而本着有坑必填的目标,笔者还是花了几个晚上的下班时候在多个互联网参考资料的帮助下完成了 ...

  9. 首个threejs项目-前端填坑指南

    第一次使用threejs到实际项目中,开始的时候心情有点小激动,毕竟是第一次嘛,然而做着做着就感受到这玩意水好深,满满的都是坑,填都填不过来.经过老板20天惨无人道的摧残,终于小有成就. 因为第一次搞 ...

随机推荐

  1. React 与 React-Native 使用同一个 meteor 后台

    meteor 可以快速构建 pc,移动端,桌面端应用. 最大的优点是:数据库的数据发生变化时,可以实时推送到前端,非常适用于实时展示的应用开发. 在 react,react-native 应用中,可以 ...

  2. Docker & ASP.NET Core (5)：Docker Compose

    第一篇:把代码连接到容器 第二篇:定制Docker镜像 第三篇:发布镜像 第四篇:容器间的连接 Docker Compose简介 Compose是一个用来定义和运行多容器Docker应用的工具.使用C ...

  3. ES 09 - 定制Elasticsearch的分词器 (自定义分词策略)

    目录 1 索引的分析 1.1 分析器的组成 1.2 倒排索引的核心原理-normalization 2 ES的默认分词器 3 修改分词器 4 定制分词器 4.1 向索引中添加自定义的分词器 4.2 测 ...

  4. .net core下简单构建高可用服务集群

    一说到集群服务相信对普通开发者来说肯定想到很复杂的事情,如zeekeeper ,反向代理服务网关等一系列的搭建和配置等等:总得来说需要有一定经验和规划的团队才能应用起来.在这文章里你能看到在.net ...

  5. 秋招提前批小结（CVTE一面挂、阿里三面挂）

    7月27日:CVTE一面 30分钟(挂) 1.自我介绍 2.有没有做过JavaWeb相关的项目?你觉得难点在哪里呢? 3.你这个博客系统有没有加权限系统?如果被拦截封包获取了账号密码怎么办?(没加,凉 ...

  6. C#语法——元组类型

     元组Tuple   我们现在使用的C#语法已经可以满足日常的开发需求,但C#语法还在进行版本的更新,在创造更多更优秀的语义来让我们使用.这里介绍一下C#5.0里的提供的语法——元组. 在C#中定义T ...

  7. vue.js之组件篇

    Vue.js 组件 模块化:是从代码逻辑的角度进行划分的: 组件化:是从UI界面的角度进行划分的. 组件(Component)是 Vue.js 最强大的功能之一,组件可以扩展 HTML 元素,封装可重 ...

  8. vs2015安装编辑神器：resharper10.0

    在平时的开发工作中,作为一名程序员,难免会想办法找到适合自己的开发编辑器.这款插件来自JetBrains公司.接下来就来教大家如何对这款软件进行安装与破解. 1:首先下载与安装.如果没有找到适合的资源 ...

  9. ITSA(IT Strategy and Architecture)方法介绍

    Architecture Capability – At a Glance Architectural coherence part1 Architectural coherence part2 SA ...

  10. 浅谈Quartz.Net 从无到有创建实例

    一.Quartz.Net介绍 Quartz.NET是一个开源的作业调度框架,非常适合在平时的工作中,定时轮询数据库同步,定时邮件通知,定时处理数据等. Quartz.NET允许开发人员根据时间间隔(或 ...