Fatal编程技术网
  • javascript/
  • Javascript Vuejs将选项传递到组件

Javascript Vuejs将选项传递到组件

javascript vue.js

Javascript Vuejs将选项传递到组件,javascript,components,vue.js,Javascript,Components,Vue.js,我有一个vue组件，它是一个滑块 <Slider images= ['img/da-slide1.png', 'img/da-slide1.png'] bg = "#000000" speed = 1 > </Slider> 我想通过各种选择。我已经尝试了上面的代码，但没有任何运气 我还想把图像的v-for输出 <div v-for="item in images"> {{ item }} </div>> {

我有一个vue组件，它是一个滑块

<Slider
  images= ['img/da-slide1.png', 'img/da-slide1.png']
  bg = "#000000"
  speed = 1
>
</Slider>
我想通过各种选择。我已经尝试了上面的代码，但没有任何运气

我还想把图像的v-for输出

<div v-for="item in images">
    {{ item }}
  </div>>


{{item}}
>
可以这样做吗？

您需要将图像数组作为属性传递，请注意冒号
：images
：

<Slider
  :images="['img/da-slide1.png', 'img/da-slide1.png']"
  bg="#000000"
  speed="1"
></Slider>
还记得在滑块组件中声明道具：['images'] 
Vue.component（'slider'{
模板：“”+
'' +
'' +
'' +
'',
道具：{
图像：{type:Array}，
背景颜色：{type:String，默认值：#000000}，
速度：{type:Number}，
},
计算：{
cBackgroundColor:function（）{
返回“背景色：”+this.backgroundColor；
}
}
});
新Vue({
el:“应用程序”
});

滑块{
显示：内联块；
}
img{
宽度：100px；
高度：100px；
}


太好了，我明白了，这只是语法问题，但我该如何为它们提供v-for？