problem description

modify the size of the picture so that the picture cannot be fully displayed. The version we use is weex 0.18.

related codes

<template>
  <div >
    <image :class="[tapFlag == 1 ? "image1" : "image2"]"  src="https://vuejs.org/images/logo.png" @click="onclick"></image>
  </div>
</template>

<style scoped>

  .image1 {
    width:270px;
    height:280px;
    border-top-right-radius: 100px;
  }
  .image2 {
    width:470px;
    height:480px;
    border-top-right-radius: 100px;
  }
</style>

<script>
export default {
  data:{
    tapFlag : 1
  },
  methods: {
    onclick() {
      if(1 == this.tapFlag){
        this.tapFlag = 2
      } else {
        this.tapFlag = 1
      }
    }
  }
}
</script>

what result do you expect? What is the error message actually seen?

check the source code and find:

- (void)_frameDidCalculated:(BOOL)isChanged
{
    [super _frameDidCalculated:isChanged];
    
    if ([self isViewLoaded] && isChanged) {
        __weak typeof(self) weakSelf = self;
        WXPerformBlockOnMainThread(^{
            [weakSelf _clipsToBounds];
        });
    }
}

check the latest source code discovery

in

 - (void)_resetNativeBorderRadius 
  [self _clipsToBounds];

solved the problem.

Why not

- (void)_frameDidCalculated:(BOOL)isChanged
{
    [super _frameDidCalculated:isChanged];
    
    if ([self isViewLoaded] && isChanged) {
        __weak typeof(self) weakSelf = self;
                [self.weexInstance.componentManager _addUITask:^{
            __strong typeof(weakSelf) strongSelf = weakSelf;
            if (strongSelf == nil) {
               return;
            }
            [strongSelf _clipsToBounds];
        }];
    }
}