@aliretail/react-materials-components/demo/LandlineNumber/usage.md

B 端物料组件库

---
title: Input-Simple
order: 1
---

```jsx
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { Button } from '@alifd/next';
import { LandlineNumber } from '@aliretail/react-materials-components';

class App extends Component {
  state = {
    value: {},
  };

  landlineNumberRef = React.createRef();

  render() {
    return (
      <>
        <div>
          <LandlineNumber
            hasExtensionNumber={false}
            ref={this.landlineNumberRef}
            value={this.state.value}
            onChange={(val) => {
              this.setState(
                {
                  value: val,
                },
                () => {
                  this.landlineNumberRef?.current?.validate();
                },
              );
            }}
          />
        </div>
        <Button
          onClick={() => {
            console.log(this.landlineNumberRef?.current?.validate());
          }}
        >
          提交验证
        </Button>
      </>
    );
  }
}

ReactDOM.render(<App />, mountNode);
```