<template name:trailerStars>
<image v-for="yellow in yellowScore"
src="../static/icos/star-yellow.png" class="star-ico">
</image>
<image v-for="gray in grayScore"
src="../static/icos/star-gray.png" class="star-ico">
</image>
</template>

错误原因:

不能在根元素(root element)使用 v-for,因为v-for是个循环体呈现多个元素,v-for在根元素上导致无法渲染。

解决方案:

将元素包裹到另外的标签中:

<template name:trailerStars>
<view>
<image v-for="yellow in yellowScore"
src="../static/icos/star-yellow.png" class="star-ico">
</image>
<image v-for="gray in grayScore"
src="../static/icos/star-gray.png" class="star-ico">
</image>
</view> </template>

参考链接:https://blog.csdn.net/hua_ban_yu/article/details/80256611

Cannot use v-for on stateful component root element because it renders multiple elements.的更多相关文章

  1. Ejb3 + Jboss8 出现Session id hasn't been set for stateful component

    Ejb 3 + JBoss 8  在使用客户端远程访问有状态的Ejb对象时,出现ERROR: Session id hasn't been set for stateful component 出现该 ...

  2. VUE之命令行报错:Component template should contain exactly one root element. If you are using v-if on multiple elements, use v-else-if to chain them instead 解决办法

    Failed to compile. ./node_modules/vue-loader/lib/template-compiler?{"id":"data-v-5992 ...

  3. VUE编译报错 Component template should contain exactly one root element. If you are using v-if on multiple elements, use v-else-if to chain them instead

    背景: 在使用VUE添加标签的时候编译报错,报错如下: Component template should contain exactly one root element. If you are u ...

  4. vue报错:Component template should contain exactly one root element. If you are using v-if on multiple elements, use v-else-if to chain them instead.

    在.vue文件中引入了 element-ui 的 table 和 pagination 组件后,报错:Component template should contain exactly one roo ...

  5. AngularJS: 'Template for directive must have exactly one root element' when using 'th' tag in directive template

    .controller('HomeController', function($scope,$location) { $scope.userName='天下大势,为我所控!'; $scope.clkU ...

  6. Caused by: org.xml.sax.SAXParseException; systemId: file:/home/hadoop/hive-0.12.0/conf/hive-site.xml; lineNumber: 5; columnNumber: 2; The markup in the document following the root element must be well

    1:Hive安装的过程(Hive启动的时候报的错误),贴一下错误,和为什么错,以及解决方法: [root@master bin]# ./hive // :: INFO Configuration.de ...

  7. which had no Root Element. This likely means the XML is malformed or missing

    今天按照古月老师的步骤,想在RViz中配置插件. 按步骤做下来后,一运行,出现如下错误: [E[ERROR] [1523370744.057263390]: Skipping XML Document ...

  8. maven web项目的web.xml报错The markup in the document following the root element must be well-formed.

    maven项目里面的web.xml开头约束是这样的 <?xml version="1.0" encoding="UTF-8"?> <web-a ...

  9. Possible overdraw: Root element paints background @drawable/happy with a theme that also paints a background (inferred theme is @style/AppTheme)

    安卓界面插入背景图片,当图片内存太大时,界面在切换时会加载失败,这是什么原因呢?这是设置android:background属性时发出的warning: Possible overdraw: Root ...

  10. [React] Write a stateful Component with the React useState Hook and TypeScript

    Here we refactor a React TypeScript class component to a function component with a useState hook and ...

随机推荐

  1. 多维评测指标解读2022MSU世界编码器大赛结果

    是极致性能,更是最佳商用. 19项第一之上,是63%的极致带宽降低 近日,2022 MSU世界视频编码器大赛成绩正式揭晓.报告显示,阿里媒体处理服务MPS(Alibaba Media Processi ...

  2. 深度学习04-(Tensorflow简介、图与会话、张量基本操作、Tensorboard可视化、综合案例:线性回归)

    深度学习04-Tensorflow 深度学习04-(Tensorflow) Tensorflow概述 Tensorflow简介 什么是Tensorflow Tensorflow的特点 Tensorfl ...

  3. Stream方法的介绍

    文章目录 前言 Lambda表达式 格式 函数式接口 Stream的方法介绍 forEach filter collect count sum limit 和skip groupingBy reduc ...

  4. 当我再次用Kotlin完成五年前已经通过Kotlin完成的项目后

      > 近日来对Kotlin的使用频率越来越高, 也对自己近年来写过的Kotlin代码尝试进行一个简单的整理. 翻到了自己五年前第一次使用Kotlin来完成的一个项目([贝塞尔曲线](https ...

  5. StarCoder: 最先进的代码大模型

    关于 BigCode BigCode 是由 Hugging Face 和 ServiceNow 共同领导的开放式科学合作项目,该项目致力于开发负责任的代码大模型. StarCoder 简介 StarC ...

  6. js验证统一社会信用代码

    js验证统一社会信用代码 //验证信用代码 function CheckSocialCreditCode(Code) { var patrn = /^[0-9A-Z]+$/; //18位校验及大写校验 ...

  7. 2022-11-16:给你一个数组 nums,我们可以将它按一个非负整数 k 进行轮调, 例如,数组为 nums = [2,4,1,3,0], 我们按 k = 2 进行轮调后,它将变成 [1,3,0,

    2022-11-16:给你一个数组 nums,我们可以将它按一个非负整数 k 进行轮调, 例如,数组为 nums = [2,4,1,3,0], 我们按 k = 2 进行轮调后,它将变成 [1,3,0, ...

  8. 2022-07-06:以下go语言代码是否会panic?A:会;B:不会。 package main import “C“ func main() { var ch chan struct

    2022-07-06:以下go语言代码是否会panic?A:会:B:不会. package main import "C" func main() { var ch chan st ...

  9. 2022-06-01:给定一个数组arr,可能有正、有负、有0,无序。 只能挑选两个数字,想尽量让两个数字加起来的绝对值尽量小。 返回可能的最小的值。

    2022-06-01:给定一个数组arr,可能有正.有负.有0,无序. 只能挑选两个数字,想尽量让两个数字加起来的绝对值尽量小. 返回可能的最小的值. 答案2022-06-01: 排序,双指针. 代码 ...

  10. 【故障公告】博客站点一台阿里云负载均衡被DDoS攻击

    13:06 收到阿里云的电话与邮件通知,博客站点的一台阿里云负载均衡因被 DDoS 攻击被关进黑洞(所有访问被屏蔽),部分用户的访问受影响,由此给您带来麻烦,请您谅解. 您的IP:x.x.x.x 实例 ...