vue list添加元素

作者：颓废的爱情发布日期:2025-10-11 浏览:95

// Vue 实例中添加元素到列表的示例代码

// 引入 Vue
import Vue from 'vue';

// 创建一个 Vue 实例
new Vue({
  el: '#app',
  data: {
    items: ['苹果', '香蕉', '橙子'] // 初始列表数据
  },
  methods: {
    addItem() {
      // 添加新元素到列表中
      this.items.push('葡萄'); // 使用 push 方法将新元素添加到数组末尾
    }
  }
});

/* 
解释说明：
1. `data` 中定义了一个名为 `items` 的数组，包含初始的列表元素。
2. `methods` 中定义了一个名为 `addItem` 的方法，该方法使用 `push` 方法向 `items` 数组中添加一个新的元素（例如 '葡萄'）。
3. 当调用 `addItem` 方法时，Vue 会自动更新视图，显示新的列表内容。
*/

上一篇：vue响应式布局

下一篇：vue 隐藏滚动条