fix(goods-action-button): rerender style after link change (#3145)

fix #3138

example/pages/goods-action/index.wxml

@@ -45,7 +45,7 @@
   <van-goods-action custom-class="goods-action-position" safe-area-inset-bottom="{{ false }}">
     <van-goods-action-icon icon="chat-o" text="客服" />
     <van-goods-action-icon icon="shop-o" text="店铺" />
-    <van-goods-action-button color="#7232dd"  text="加入购物" type="warning" />
+    <van-goods-action-button color="#7232dd"  text="加入购物车" type="warning" />
     <van-goods-action-button plain color="#7232dd" text="立即购买" />
   </van-goods-action>
 </demo-block>

packages/goods-action-button/index.ts

@@ -23,10 +23,6 @@ VantComponent({
     },
   },
 
-  mounted() {
-    this.updateStyle();
-  },
-
   methods: {
     onClick(event: Weapp.Event) {
       this.$emit('click', event.detail);
@@ -34,6 +30,10 @@ VantComponent({
     },
 
     updateStyle() {
+      if (this.parent == null) {
+        return;
+      }
+
       const { children = [] } = this.parent;
       const { length } = children;
       const index = children.indexOf(this);

packages/goods-action/index.ts

@@ -5,6 +5,15 @@ VantComponent({
     type: 'descendant',
     name: 'goods-action-button',
     current: 'goods-action',
+    linked() {
+      this.updateStyle();
+    },
+    unlinked() {
+      this.updateStyle();
+    },
+    linkChanged() {
+      this.updateStyle();
+    },
   },
   props: {
     safeAreaInsetBottom: {
@@ -12,4 +21,16 @@ VantComponent({
       value: true,
     },
   },
+
+  methods: {
+    updateStyle() {
+      wx.nextTick(() => {
+        this.children.forEach(
+          (child: WechatMiniprogram.Component.TrivialInstance) => {
+            child.updateStyle();
+          }
+        );
+      });
+    },
+  },
 });