关于#vue.js#的问题：关于vue框架如何获取数组中的值的问题

Question

关于vue框架如何获取数组中的值的问题

今天是跟着黑马自学vue的第二天，在学完v-指令尝试实践一下 如何切换相片时遇到无法获取数组中的值的问题。

教学视频中获取数组中的值的方法：

<img :src=imgArr[index] alt=" "

data:{
  imgArr:[
       "./images/00.jpg",
       "./images/01.jpg",
       "·/images/02.jpg",
       "./images/03.jpg",
       "./images/04.jpg",
       "·/images/05.jpg",
       "./images/06.jpg",
       "·/images/07.jpg",
       "·/images/08.jpg",
       "·/images/09.jpg",
       "·/images/10.jpg",
  ],
  index:0,
}

这是我获取数组中的值的方法：

尝试了好几遍图片依旧没有显示，我在想是否结构中表达无法获取数组中的值呢? 于是我尝试在js部分尝试输出数组的值：

希望各位能指点一下哪里错了

Answer 1

• 你可以看下这个问题的回答https://ask.csdn.net/questions/1092327
• 这篇博客你也可以参考下：在做VUE项目时遇到的问题及解决办法：点击不同的标题加载不同的组件，使用路由去切换组件时，第一次进入这个页面没有默认显示的子组件
• 除此之外, 这篇博客: vue中子组件修改父组件传入的值问题中的 在讲vue之前，我们先来了解一下js中参数的传递 部分也许能够解决你的问题, 你可以仔细阅读以下内容或跳转源博客中阅读:
  

• 什么是按值传递呢？简单来说按值传递就是将一个变量复制给另一个变量，当复制的那个变量发生改变时，原来的变量不会发生改变，举个简单的例子。

  var a=1;
  function arr(b)
  {
  	b=2;
  	console.log(b);//2
  }
  arr(a);
  console.log(a);//1
  

  这就验证了我们刚才所说的，这里将变量a复制给了b，相当于将a拷贝了一份，b改变时a不改变

  引用传递相对于按值传递适用于更复杂的数据结构，比如数组，对象，引用传递简单来说就是所有的变量都来自同一个对象，他们都是这个对象的引用，当其中引用发生改变时，相应的对象的值也会发生，也就使得其他的引用也发生改变，举个例子：

  var a={
  	name:'张三'
  }
  function arr(b)
  {
  	b.name='李四';
  	console.log(b.name);//李四
  }
  arr(a);
  console.log(a.name);//李四
  

  讲完js后我们再来看看vue中父子组件传值修改问题，vue中父子组件常用的传值方式就是props,$emit通常来说父组件的更新会向下流到子组件，但是反过来不行，这样就能防止子组件意外改变父组件的数据，从而导致数据流向难以理解，但是有一种情况，当父组件传入的值是数组或者对象时，子组件就能改变父组件传过来的数据，而且父组件中的数据也会随着改变，这是为什么呢，其实我们上面就已经讲了，下面我们来深入理解下。
  1、js数据类型
  （1）基本数据类型：String,Number,Boolean等
  （2）引用数据类型：Object,Array,Function
  2、js存储空间分配
  js在运行中有三种内存空间，分别是代码空间，栈空间，堆空间，其中的代码空间主要是存储可执行代码的，栈空间就是调用栈，是用来存储执行上下文的，堆空间是用来储存引用数据类型的，js执行的时候，会把基本类型的数据保存在栈空间中，引用类型的数据保存在堆空间中。当定义引用数据类型的时候，数据会被保存在堆空间，栈空间只保留数据的引用，当需要访问这些数据是，通过栈中的引用来进行访问，所以当父组件传递对象或者数组时，传递的其实是一个引用地址