如何在Vue模板template动态中引入图片

如何在Vue模板template动态中引入图片

let main_a ={
        template:`
            

                

                    

                        

                        

                            
{{item.listTitle}}
                            
{{item.listContent}}{{item.listMoney}}
                            
{{item.listTime}}
                        
                    
                
            
        `,
        data(){
            return{
                list:[
                    {
                        mySrc:"https://www.lgstatic.com/i/image/M00/23/AC/Cgp3O1cYSLeAKJQgAAENKq5RGDY571.jpg",
                        listTitle:"创建科技",
                        listContent:"JAVA开发主管 [ 杭州 ]",
                        listMoney:"10k-12k",
                        listTime:"今天 17:07",
                    },
                  ]
                }
             }
      }

重要点：需要在模板中的li中用到v-bind属性

<li><img v-bind:src="item.mySrc"></li>

css html代码不粘了， js完整代码

let main_a ={
        template:`
            

                

                    

                        

                        

                            
{{item.listTitle}}
                            
{{item.listContent}}{{item.listMoney}}
                            
{{item.listTime}}
                        
                    
                
            
        `,
        data(){
            return{
                list:[
                    {
                        mySrc:"https://www.lgstatic.com/i/image/M00/23/AC/Cgp3O1cYSLeAKJQgAAENKq5RGDY571.jpg",
                        listTitle:"创建科技",
                        listContent:"JAVA开发主管 [ 杭州 ]",
                        listMoney:"10k-12k",
                        listTime:"今天 17:07",
                    },
                    {
                        mySrc:"https://www.lgstatic.com/i/image/M00/84/EC/CgqKkVhfhp2APcR8AAB6n_Ah3zc236.jpg",
                        listTitle:"创客家科技",
                        listContent:"【实习生】游戏原画设计师助理 [ 深圳 ]",
                        listMoney:"6k-8k",
                        listTime:"今天 00:59",
                    },
                    
                ]
            }
        }
    }
 let vm = new Vue({
        el:"#app",
        data:{},
        components:{
            "main_a":main_a,
        }
    })

最后效果