我在界面里显示不了,因为我是通过两个<script>标签分别写的new Vue({})和这个方法
时间: 2024-03-12 10:46:56 浏览: 54
你需要在这个方法中实例化Vue,并将其绑定到一个DOM元素上。
假设你的HTML代码如下:
```
<div id="app"></div>
```
那么你可以在这个方法中添加以下代码:
```
function draw(arrayType){
middleDiv.innerHTML = '<ul class="multi-column">'+
'<li class="mall-li" v-for="items in filteredArr.'+ arrayType +':key="items.id">' +
'<div class="box">'+
'<div><img :src="items.pic" alt="" class="mall-pic"></div>'+
'<div class="mall_a">'+'<div class="thing_name">{{items.name}}</div>'+
'<div class="cart" @click="addToCart(items.name,items.price,items.pic)">'+
'<img class="cart_img" src="img/cart.png" />'+'</div>'+
'<div style="color: red;line-height: 40px;">¥{{items.price}}</div>'+'</div>'+'</div>'+
'</li>'+'</ul>';
// 实例化Vue
new Vue({
el: '#app', // 绑定到DOM元素上
data: {
filteredArr: [] // 数据
}
});
}
```
这样就可以将Vue实例绑定到id为app的DOM元素上了。你还需要在Vue实例中添加一些数据和方法来控制你的界面。
阅读全文