ant-design/components/mention/demo/readonly.md
陆离 4518b02095 feat: support Mention[disabled|readOnly] and add some warning(#6004)
#### FEATURES

 * use `ContentState` instead of `EditorState`, selection events won't trigger
   onChange anymore.
 * deprecated `Mention.toEditorState`, instead of `Mention.toContentState`,
 * `Mention.toEditorState` are compatibled, but have a warnning in console.

 #### ISSUES

 * `disabled` and `readOnly` props supported.
 * fixed controlled mode bug.

 * close #5788
 * close #5175
 * close #https://github.com/react-component/editor-mention/issues/7
2017-05-05 14:53:46 +08:00

54 lines
987 B
Markdown

---
order: 7
title:
zh-CN: 无效或只读
en-US: disabled or readOnly
---
## zh-CN
通过 `disabled` 属性设置是否生效。通过 `readOnly` 属性设置是否只读。
## en-US
Configurate `disabled` and `readOnly`.
````jsx
import { Mention } from 'antd';
const { toString } = Mention;
function onChange(editorState) {
console.log(toString(editorState));
}
const users = ['afc163', 'benjycui', 'yiminghe', 'jljsj33', 'dqaria', 'RaoHai'];
function App() {
return (
<div>
<div style={{ marginBottom: 10 }}>
<Mention
style={{ width: '100%' }}
onChange={onChange}
placeholder="this is disabled Mention"
suggestions={users}
disabled
/>
</div>
<Mention
style={{ width: '100%' }}
onChange={onChange}
placeholder="this is readOnly Mention"
suggestions={users}
readOnly
/>
</div>
);
}
ReactDOM.render(
<App />
, mountNode);
````