一.img中的src的字符串动态拼接

• 1.问题是这样子的,瞧瞧
  基本网络链接 : http://openweathermap.org/img/w/02n.png ; 但是了字符'02n'是动态的,切换它可以获取不同的天气图片,如果这样的链接在vue的v-for中该如何拼接字符串了,下解:

• 2.解决这个问题

  • 方法一(你可以这样写)、

  <ul>
  
        <li v-for='item in weatherArr'>
  
            ![]('http://openweathermap.org/img/w/'+item.weather[0].icon+'.png')
  
        </li>
  
  </ul>

  • 方法二(你还可以这样写:es6的语法)

  <ul>
  
          <li v-for='item in weatherArr'>
  
              <img :src=`http://openweathermap.org/img/w/${item.weather[0].icon}.png`>
  
          </li>
  
  </ul>

<ul>

        <li class="imgStyle" v-for='item in items' :style="{background:'url('+item.imgURL+')'}"></li>

</ul>