在vue中props转指定字符，例如只能穿left和right

在Vue.js中，如果你想要限制用户通过`props`传递的数据只能是特定的值（如"left"或"right"），你可以使用`v-bind`指令并设置`prop`的默认值以及验证函数。首先，在组件的`props`选项中声明这个属性，并设置默认值：

<template>
  <div :class="direction">
    <!-- 其他内容 -->
  </div>
</template>

<script>
export default {
  props: {
    direction: {
      type: String,
      default: 'left', // 设置默认值
      validator: (value) => ['left', 'right'].includes(value), // 验证函数
      required: true, // 如果未传值则抛出错误
    },
  },
  computed: {
    // 如果需要转换成其他形式（比如驼峰命名法等），可以在computed里处理
    // 这里假设我们不需要额外转换，直接使用原始值
    formattedDirection() {
      return this.direction;
    }
  },
};
</script>

在这个例子中，如果用户尝试传递除"left"或"right"以外的值，`validator`将会返回`false`，触发验证失败，并显示相应的错误信息。确保在实际项目中添加适当的错误处理。