诗岑 2020-08-12 19:14 采纳率: 93%
浏览 166
已采纳

HTML+JavaScript数组没有显示

如题,在HTML和JavaScript中设置了数组,但是在网页中并没有显示

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>vueapp</title>
<script src="https://static.runoob.com/assets/vue/1.0.11/vue.min.js"></script>
<script src="vueapp.js"></script>
</head>

<body>
<div id="app">
<ul>
<li v-for="todo in todos">
{{todo.text}}
</li>
</ul>
</div>
<!--arrays--->
<div id="app">
<ul id="example 2">
<li v-for="item in items">
{{parentMessage}}-{{$index}}-{{item.message}}
</li>
</ul>
</div>
</body>
<script src="vueapp.js"></script>
</html>

// JavaScript Document
new Vue({
    el:'#app',
    data:{
        todos:[
        {text:'learn javascript'},
        {text:'learn vue.js'},
        {text:'build something awesome'}
        ]
    }
})
var example2=new Vue({
    el:'#example 2',
    data:{
        parentMessage:'official website',
        items:[
        {message:'www.runoob.com'},
        {message:'www.runoob.com'},
        ]
    }
})

  • 写回答

3条回答 默认 最新

  • jingluan666 2020-08-13 08:17
    关注

    把id="example 2"中的空格去掉(引用的地方一样),id中不要使用空格,要么使用下划线

    另外,index使用是不是该这样:

    <li v-for="(item,index) in items">
    {{parentMessage}}-{{index}}-{{item.message}}
    </li>
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(2条)

报告相同问题?

悬赏问题

  • ¥15 ads仿真结果在圆图上是怎么读数的
  • ¥20 Cotex M3的调试和程序执行方式是什么样的?
  • ¥20 java项目连接sqlserver时报ssl相关错误
  • ¥15 一道python难题3
  • ¥15 用matlab 设计一个不动点迭代法求解非线性方程组的代码
  • ¥15 牛顿斯科特系数表表示
  • ¥15 arduino 步进电机
  • ¥20 程序进入HardFault_Handler
  • ¥15 oracle集群安装出bug
  • ¥15 关于#python#的问题:自动化测试