Facing problems with using new method of calling onFulfill()

[aggnostos]

I need to call onFulfill when entire code is entered. So I removed onChangeText={setValue} and pasted:

onChangeText={(value) => {
    if (value.length === CELL_COUNT) {
        onFulfill(value);
    }
}}

But now I can't enter any text, so where I should place setValue?

[LordParsley]

@Lian39 you'll still need to update the value using setValue or else the component won't know that its own value has changed. But you can add your onFulfill call after that.

Based on the minimal example, maybe try something like this:

<CodeField
      ref={ref}
      {...props}
      // Use `caretHidden={false}` when users can't paste a text value, because context menu doesn't appear
      value={value}
      onChangeText={(text) => {
        setValue(text);

        // Submit the completed PIN.
        if (text && text.length === CELL_COUNT) {
          onFulfill(text);
        }
      }}
      cellCount={CELL_COUNT}
      rootStyle={styles.codeFieldRoot}
      keyboardType="number-pad"
      textContentType="oneTimeCode"
      renderCell={({ index, symbol, isFocused }) => (
        <Text
          key={index}
          style={[styles.cell, isFocused && styles.focusCell]}
          onLayout={getCellOnLayoutHandler(index)}
        >
          {symbol || (isFocused ? <Cursor /> : null)}
        </Text>
      )}
    />