vue3中如何让css样式的left值根据全局变量开关状态值改变let isExpand = ref(false)；

在Vue3中，如果你想让CSS样式的`left`值根据全局变量`isExpand`的状态变化而动态改变，你可以使用`ref`创建一个响应式变量，并结合模板绑定或者计算属性来实现这个功能。假设你有一个元素的`el`引用，这里是一个简单的例子：

<template>
  <div :style="{ left: isExpand.value ? '200px' : '0px' }">
    <!-- 元素内容 -->
  </div>
</template>

<script>
import { ref } from 'vue';

export default {
  setup() {
    const isExpand = ref(false); // 创建一个全局变量

    // 当isExpand变化时，会自动更新对应的样式
    isExpand.value = true; // 可以在这里手动设置或监听其变化

    return { isExpand };
  }
};
</script>

在这个例子中，当`isExpand`为`true`时，元素的`left`值会被设置为`200px`，否则为`0px`。