vue3.0,element为基础编写单击li标签后，被点击的li标签保持active css样式，其他li标签不受影响，维持初始状态的代码

你可以在点击事件中给被点击的 li 标签添加一个 active 类，并在 CSS 中定义 active 类的样式。同时，你需要在其他 li 标签中移除 active 类，以保证它们不会受到影响。下面是一个示例代码：

HTML：

<ul>
  <li @click="selectItem" :class="{ active: selectedItem === 'item1' }">Item 1</li>
  <li @click="selectItem" :class="{ active: selectedItem === 'item2' }">Item 2</li>
  <li @click="selectItem" :class="{ active: selectedItem === 'item3' }">Item 3</li>
</ul>

JS：

export default {
  data() {
    return {
      selectedItem: ''
    };
  },
  methods: {
    selectItem(event) {
      // 移除其他 li 标签的 active 类
      const lis = event.currentTarget.parentNode.children;
      for (let i = 0; i < lis.length; i++) {
        const li = lis[i];
        if (li !== event.currentTarget) {
          li.classList.remove('active');
        }
      }
      // 添加被点击的 li 标签的 active 类
      this.selectedItem = event.currentTarget.innerText;
      event.currentTarget.classList.add('active');
    }
  }
};

CSS：

li.active {
  background-color: #ccc;
}

这样，当你点击某个 li 标签时，它将会添加 active 类，其他 li 标签会移除 active 类，保持初始状态。同时，被添加了 active 类的 li 标签会应用 active 类的 CSS 样式。