无论如何我都获取不到 setNativeProps 这个方法，v0.68.2

[zhuqingyv]

import { Component, createRef, cloneElement } from 'react';
import { View, Text, UIManager, findNodeHandle } from 'react-native';

const uuid = () => {
  const s = [];
  const hexDigits = "0123456789abcdef";

  for (let i = 0; i < 36; i++) {
    s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
  };

  s[14] = "4";
  s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1);
  s[8] = s[13] = s[18] = s[23] = "-";

  return s.join('');
};

const containerStyle = {
  display: 'flex',
  flexDirection: 'row',
  justifyContent: 'flex-start',
  alignItems: 'flex-start',
  flexWrap: 'wrap',
  overflow: 'hidden'
};

const isText = (child) => {
  if (!child) return null;
  const { props } = child;
  const { children } = props;
  const isString = typeof children === 'string';
  if (isString) return children;
  return null;
};

const childrenToArray = (children) => {
  if (children instanceof Array) return children;
  return [children];
};

const overflow = (childRect, parentRect) => {
  if ((childRect.pageY + childRect.height) > (parentRect.y + parentRect.height) || (childRect.pageX + childRect.width) > (parentRect.x + parentRect.width)) return true;
};

export default class Label extends Component {
  renderListRef = [];

  id = uuid();

  constructor() {
    super();
    globalThis.aa = this;
  }

  resolveChilden = (_children) => {
    this.renderListRef = [];
    const children = childrenToArray(_children);
    const renderList = [];
    let _index = 0;
    children.forEach((child, index) => {
      const text = isText(child);

      if (text === null) {
        const ref = this.renderListRef[_index] = createRef()
        _index += 1;
        return renderList.push(cloneElement(
          child,
          { ref, key: `${this.id}-${index}` }
        ));
      };

      for (let i = 0;i<text.length;i++) {
        const ref = this.renderListRef[_index] = createRef()
        _index += 1;
        renderList.push(
          cloneElement(child, {
            ref,
            key: `${this.id}-${index}-${i}`
          }, [text[i]])
        )
      };

    });

    return renderList;
  };

  onLayout = (event) => {
    const {} = this.props
    const { layout } = event.nativeEvent;
    let shouldEs = false;

    for (let i = this.renderListRef.length - 1; i > 0; i--) {
      console.log(`this.renderListRef[${i}]`)
      console.log(this.renderListRef[i].current.measure); // undefined
      // UIManager.measure(findNodeHandle(this.renderListRef[i].current), (...arg) => {
      //   const [x, y, width, height, pageX, pageY] = arg;
      //   const isOverFlow = overflow({ x, y, width, height, pageX, pageY}, layout);
      //   if (isOverFlow) {
      //     shouldEs = true;
      //     console.log(`this.renderListRef[${i}].setNativeProps`)
      //     console.log(this.renderListRef[i].current)
      //   } else {

      //   };
      // });
      // this.refs[CHILD_REF].setNativeProps({
      //   opacity: value
      // });
    };
  };

  render() {
    const { children } = this.props;

    return (
      <View style={this.style} onLayout={this.onLayout}>
        {this.resolveChilden(children)}
      </View>
    )
  };

  get style() {
    const { width, height, style } = this.props;
    return { ...containerStyle, ...style, width, height };
  };
};

[zhuqingyv]

主要看这行：this.renderListRef[i].current.measure // undefined

[sunnylqm]

[sunnylqm]

我不会用ref去测量，用起来不可靠，还是每个都去onLayout最可靠

也没看懂你这个组件是要干什么，你可以参考我用reanimated做滚动组件，我猜你大概也是要写类似的东西？ https://github.com/OneKeyHQ/app-monorepo/blob/onekey/packages/components/src/ScrollableButtonGroup/ScrollableButtonGroup.tsx

演示效果 https://github.com/OneKeyHQ/app-monorepo/pull/1920

[zhuqingyv]

事情大概是这样的，为了实现图文混排，并且需要换行，最常见的场景就是商品前加一个 「特惠」的标志或者双十一的标签，这可能是一个View组件或者是Image，后面跟着Text文本，然后设定超出显示 ...。我想做的就是把text每一个字符拆成独立的text，父元素flex-wrap: warp换行，最后利用onLayout计算超出的文字，然后将超出之前的最后三个字符转换为...

[xlieee]

collapsable={false}

[github-actions[bot]]

👋 Hey there, it looks like there has been no activity on this issue in the last 90 days. Has the issue been fixed, or does it still require the community attention? This issue will be closed in the next 7 days if no further activity occurs. Thank you for your contributions.

[github-actions[bot]]

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please feel free to create a new issue with up-to-date information.