滚动公告

1、只改变内容不会滚动

<div class="body_b" :class="{marquee_top:animate}">
  <div class="body_con" v-for="item in list" :key="item.id">
 	 <img :src="item.src" style="float:left">
     <p>{{item.content}}</p>
   </div>
 </div>

js：
  data () {
    return {
      animate:false,
      list:[
        {id:'1',src:require('../assets/4.png'),content:'2019年10月09日 15:20:20，车牌号为豫A88888进入现场'},
        {id:'2',src:require('../assets/4.png'),content:'2019年10月08日 18:20:20，车牌号为豫A88888进入现场'},
        {id:'3',src:require('../assets/4.png'),content:'2019年10月07日 16:20:20，车牌号为豫A88888进入现场'}      ]
    }
  },

  methods: {
    startMove:function () {
        this.animate = true;
        setTimeout(()=>{
            this.list.push(this.list[0]);
        this.list.shift();
        this.animate = false;
    },500)},
  },
  created () {
    setInterval(this.startMove, 2000)
  }

but有个错 不晓得咋解决~~~晓得的联系下 学习下 谢谢

2、用element组件滚动

<el-carousel height="40px" direction="vertical" indicator-position="none" :interval='2000'>
  <el-carousel-item v-for="(item,i) in warning" :key="i">
    <el-button :type="item.type" class="warn_btn">紧急告警</el-button>
    <span class="warn_con">{{item.content}}</span>
  </el-carousel-item>
</el-carousel>

//定义
warning:[
        {type:'1',content:'2019年10月07日 15:12:36,仓库温度为50度，超出范围'},
        {type:'2',content:'2019年10月08日 15:12:36,仓库温度为450度，超出范围'},
        {type:'3',content:'2019年10月09日 15:12:36,仓库温度为585度，超出范围'}
      ],