这个v-for 有没有大哥能把完整实例 说下要怎么写 或者有空写个最简单的实例?

(3条消息) vue 解决v-for 循环列表生成不同背景颜色问题_芳草萋萋鹦鹉洲哦-CSDN博客

vue里面css的用法还搞不清楚。。

这个看着效果挺好的。。但是就是细节不会处理。。

有没有大哥有空指点一下

vue自学 初学中。。都不知道他这些代码要放在哪个部位才能运行。

有空的话写个最简单的实例 就行。。。不胜感激，

实在是我自己摸索了一两个小时了。像盲人摸象 。找不到头绪。。

https://codepen.io/521guyu/pen/vYxKMZz 

<template>
  <div id="app">
    <ul>
      <li :style="randomRgb(item)"></li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      message: 'Welcome to Vue!'
    };
  },
  methods: {
   randomRgb(item) {
      let R = Math.floor(Math.random() * 130+110);
      let G = Math.floor(Math.random() * 130+110);
      let B = Math.floor(Math.random() * 130+110);
      return {
        background: 'rgb(' + R + ',' + G + ',' + B + ')'
        };
    }

  }
};
</script>

<!-- Use preprocessors via the lang attribute! e.g. <style lang="scss"> -->
<style>
 
</style>

js方法放在methods里，在标签上直接调用就行了

淘宝或者拼多多买个视频看，学习学习就会。

vue官方文档有具体怎么使用的实例啊

HTML:

<div id="app">

<ul>

<li :style="randomRgb(item)"></li>//使用方法

</ul>

</div>

js:

methods: {

randomRgb(item) {

let R = Math.floor(Math.random() * 130+110);

let G = Math.floor(Math.random() * 130+110);

let B = Math.floor(Math.random() * 130+110);

return {

background: 'rgb(' + R + ',' + G + ',' + B + ')'

};

}

}

这个方法的目的是随机拼装背景颜色，你刷新一下就会换一种颜色rgba