vue3 uview-plus NoticeBar direction为column icon跟随text改变

在Vue3中，UView Plus组件库的NoticeBar是一个通知提示条，它可以用于显示消息、状态等信息。如果你想要设置`direction`为`column`，意味着内容会垂直排列，通常用于小屏幕手机上展示更多的行信息。

当你说`icon跟随text改变`，可能是想让图标与文本的内容或样式保持一致。在UView Plus的NoticeBar中，这通常是通过动态绑定props或者使用计算属性（computed property）来控制的。你可以这样做：

1. 首先，确保你在模板中引用了`icon`和`title`或者其他表示文本的属性，例如：

<u-v-notice-bar :direction="direction" :icon="currentIcon" :title="textContent"></u-v-notice-bar>

2. 然后，在你的Vue实例里，维护`currentIcon`和`textContent`的状态，并基于它们的变化来调整`icon`的值。例如：

export default {
  data() {
    return {
      direction: 'column',
      currentIcon: 'default', // 初始图标
      textContent: '', // 文本内容
      // 可能需要添加的方法来处理icon和text的联动变化
      changeIconAndText() {
        // 根据textContent来更新icon的值
        this.currentIcon = this.textContent.includes('成功') ? 'success' : 'warning';
      },
    };
  },
  watch: {
    textContent(newContent) {
      this.changeIconAndText();
    }
  },
};

在这个例子中，每当`textContent`发生变化，`changeIconAndText`方法会被触发，根据新文本判断应使用的图标类型。