[Steps] 步骤刷新时，只有icon刷新了，文字和线的状态没有刷新

[Zlianxin]

tdesign-miniprogram 版本

1.2.4

重现链接

https://gitee.com/jinyun0927/question_20231207.git

重现步骤

我在画面初始时给画面设置一个状态，之后通过下拉刷新更新数据后，画面上的进度条，icon部分更新了，但是文字和线的状态没有更新。
具体的代码已经放到gitee上面了。。

期望结果

期待上，我点击按钮之后，状态刷新，如图所示：

实际结果

但实际上，只有icon变了，文字和线的部分状态没有更新，如图所示：

基础库版本

3.2.3

补充说明

No response

[github-actions]

👋 @Zlianxin，感谢给 TDesign 提出了 issue。
请根据 issue 模版确保背景信息的完善，我们将调查并尽快回复你。

[betavs]

<t-steps current="{{current}}" readonly>
  <t-step-item
    wx:for="{{stepList}}"
    wx:key="index"
    title="{{item.title}}"
    icon="{{item.icon}}"
    status="{{item.status}}"
  ></t-step-item>
</t-steps>

目前只能通过 current 的变化才能更新

[Zlianxin]

@betavs
我把代码改成这样

<view class="scroll-container__status-step">
  <t-steps current="{{stepCurrent}}" readonly>
    <t-step-item wx:for="{{stepList}}" wx:key="index" title="{{item.title}}" icon="{{item.icon}}" status="{{item.status}}"></t-step-item>
  </t-steps>
  <t-button block style="margin-top: 16rpx;" bind:tap="onRefreshStepTap">步骤刷新测试</t-button>
</view>

Page({
  data: {
    /** 步骤数据 */
    stepList: [],
    /** 当前的步骤 */
    stepCurrent: 0,
    /** step1 - 4 和gitee 的代码一样，没有变 */
  },
  onLoad() {
    // 画面初始状态下为步骤1
    this.setData({
      stepList: this.data.step1,
      stepCurrent: 0,
    });
  },

  /**
   * 步骤刷新测试
   */
  onRefreshStepTap() {
    // 这个位置模拟的是实际业务中页面下拉刷新当前画面，更新进度条。此处为了方便，使用button进行测试
    this.setData({
      stepList: this.data.step2,
      stepCurrent: 1,
    });
  },
});

效果还是不太对，我需要点击两次按钮，才能变成我想要的效果，如图所示：

[betavs]

[anlyyao]

@betavs 我把代码改成这样

<view class="scroll-container__status-step">
  <t-steps current="{{stepCurrent}}" readonly>
    <t-step-item wx:for="{{stepList}}" wx:key="index" title="{{item.title}}" icon="{{item.icon}}" status="{{item.status}}"></t-step-item>
  </t-steps>
  <t-button block style="margin-top: 16rpx;" bind:tap="onRefreshStepTap">步骤刷新测试</t-button>
</view>

Page({
  data: {
    /** 步骤数据 */
    stepList: [],
    /** 当前的步骤 */
    stepCurrent: 0,
    /** step1 - 4 和gitee 的代码一样，没有变 */
  },
  onLoad() {
    // 画面初始状态下为步骤1
    this.setData({
      stepList: this.data.step1,
      stepCurrent: 0,
    });
  },

  /**
   * 步骤刷新测试
   */
  onRefreshStepTap() {
    // 这个位置模拟的是实际业务中页面下拉刷新当前画面，更新进度条。此处为了方便，使用button进行测试
    this.setData({
      stepList: this.data.step2,
      stepCurrent: 1,
    });
  },
});

效果还是不太对，我需要点击两次按钮，才能变成我想要的效果，如图所示：

暂时建议t-step-item项上不传status，组件内部会根据current值更新状态。

[Zlianxin]

@anlyyao 确实诶，t-step-item项上不传status就好了，因为着急上线，我是用了个野路子

this.setData({
  stepList:[]
})
this.setData({
  stepList: this.data.step2,
});

这样虽然不合理，但实现效果了。。。。