react native typescript, property 'textalign' does not exist on the type textinput

Viewed 1032

I just try the simple textAlign={'center'} in <TextInput/> component. It works as expect but typescript keeps complaining about the property does not exist.

The code is directly from official doc

import React, { Component } from 'react';
import { TextInput } from 'react-native';

export default function UselessTextInput() {
  const [value, onChangeText] = React.useState('Useless Placeholder');

  return (
    <TextInput
      style={{ height: 40, borderColor: 'gray', borderWidth: 1 }}
      onChangeText={text => onChangeText(text)}
      value={value}
    />
  );
}

enter image description here

In case if anyone wonder the dependency, react-native version is 0.62.2

  "devDependencies": {
    "@babel/core": "^7.6.2",
    "@babel/runtime": "^7.6.2",
    "@react-native-community/eslint-config": "^0.0.5",
    "@types/jest": "^24.9.1",
    "@types/react": "^16.9.35",
    "@types/react-native": "^0.60.31",
    "@types/react-test-renderer": "^16.9.2",
    "@typescript-eslint/eslint-plugin": "^2.12.0",
    "@typescript-eslint/parser": "^2.12.0",
    "babel-jest": "^24.9.0",
    "eslint": "^6.5.1",
    "jest": "^24.9.0",
    "metro-react-native-babel-preset": "^0.56.0",
    "react-test-renderer": "16.9.0",
    "redux-devtools": "^3.5.0",
    "typescript": "^3.9.3"
  },

Does anyone has the same problem, not sure it's a typescript bug or something wrong with my typescript configuration.

1 Answers

The type declaration for this prop seems to be missing in the DefinitelyTyped react-native index.d.ts.

However the style property textAlign is declared and seems to have the same behavior.

<TextInput
  style={{ textAlign: 'center' }}
  ...
/>
Related