Ant-design-mobile: Modal cannot input anything

Created on 25 Jan 2018  ·  8Comments  ·  Source: ant-design/ant-design-mobile


https://mobile.ant.design/components/modal-cn/, "promise" and "defaultValue" cases
antd-mobile version: 2.1.4
When call Modal.prompt() which type is "default"

bug

Most helpful comment

hi, guys, I met the same problem as yours, which I can't input more than two characters to Modal.promt ,and none of inputed characters were shown in the input zone.

Win10 ,chrome version: 63.0.3239.84 x64

"dependencies": {
    "antd-mobile": "^2.1.4",
    "react": "^16.2.0",
    "react-dom": "^16.2.0",
    "react-scripts-ts": "2.13.0"
  },

For a minimal reproduce case at CodePen :

const { Tabs, WhiteSpace, Badge, Modal, Button} = window["antd-mobile"];
const TabExample = () => (
  <div>
    <WhiteSpace />
    <Button onClick={() => Modal.prompt('页面跳转', '',[{text: 'Cancel'},
                        {text: 'Submit',
                            onPress: (value: any) => new Promise((resolve) => {
                                console.log(`jump:${value}`);
                                resolve();
                            }),
                        },
                    ], 'default', '', ['要去哪一页呢'])}>Go</Button>
  </div>
);

ReactDOM.render(<TabExample />, mountNode);

And this is the local package dependencies, seems no differences with 2.1.3 :

├─ [email protected]
│  ├─ array-tree-filter@~2.0.0
│  ├─ [email protected]
│  ├─ classnames@^2.2.1
│  ├─ normalize.css@^7.0.0
│  ├─ rc-checkbox@~2.0.0
│  ├─ rc-collapse@~1.7.0
│  ├─ rc-drawer@~0.4.9
│  ├─ rc-slider@~8.2.0
│  ├─ rc-swipeout@~2.0.0
│  ├─ rmc-calendar@^1.0.0
│  ├─ rmc-cascader@~5.0.0
│  ├─ rmc-date-picker@~6.0.0
│  ├─ rmc-dialog@^1.0.1
│  ├─ rmc-feedback@^1.0.0
│  ├─ rmc-input-number@^1.0.0
│  ├─ rmc-list-view@^0.11.0
│  ├─ rmc-notification@~1.0.0
│  ├─ rmc-nuka-carousel@~3.0.0
│  ├─ rmc-picker@~5.0.0
│  ├─ rmc-pull-to-refresh@~1.0.1
│  ├─ rmc-steps@~1.0.0
│  ├─ rmc-tabs@~1.2.0
│  ├─ rmc-tooltip@~1.0.0
│  └─ rn-topview@^0.1.6

When I downgrade to version 2.1.3, the problem just gone.

All 8 comments

ref #2177

@handsomeceleste What do you mean about cannot input anything? maybe same as #2177 ?

Hello @handsomeceleste. Please provide a re-producible demo: https://codepen.io/pen?template=LWpaKe&editors=0010

@paranoidjk I have test the "Modal.prompt()" demo under my MAC browser (Safari & Chrome), but I cannot input anything by keyboard, the value of input widget always be the last character what I inputed.
However, Under Windows, It works well, I'm not sure whether the problem is the "cursor focus" you mentioned before or not.

hi, guys, I met the same problem as yours, which I can't input more than two characters to Modal.promt ,and none of inputed characters were shown in the input zone.

Win10 ,chrome version: 63.0.3239.84 x64

"dependencies": {
    "antd-mobile": "^2.1.4",
    "react": "^16.2.0",
    "react-dom": "^16.2.0",
    "react-scripts-ts": "2.13.0"
  },

For a minimal reproduce case at CodePen :

const { Tabs, WhiteSpace, Badge, Modal, Button} = window["antd-mobile"];
const TabExample = () => (
  <div>
    <WhiteSpace />
    <Button onClick={() => Modal.prompt('页面跳转', '',[{text: 'Cancel'},
                        {text: 'Submit',
                            onPress: (value: any) => new Promise((resolve) => {
                                console.log(`jump:${value}`);
                                resolve();
                            }),
                        },
                    ], 'default', '', ['要去哪一页呢'])}>Go</Button>
  </div>
);

ReactDOM.render(<TabExample />, mountNode);

And this is the local package dependencies, seems no differences with 2.1.3 :

├─ [email protected]
│  ├─ array-tree-filter@~2.0.0
│  ├─ [email protected]
│  ├─ classnames@^2.2.1
│  ├─ normalize.css@^7.0.0
│  ├─ rc-checkbox@~2.0.0
│  ├─ rc-collapse@~1.7.0
│  ├─ rc-drawer@~0.4.9
│  ├─ rc-slider@~8.2.0
│  ├─ rc-swipeout@~2.0.0
│  ├─ rmc-calendar@^1.0.0
│  ├─ rmc-cascader@~5.0.0
│  ├─ rmc-date-picker@~6.0.0
│  ├─ rmc-dialog@^1.0.1
│  ├─ rmc-feedback@^1.0.0
│  ├─ rmc-input-number@^1.0.0
│  ├─ rmc-list-view@^0.11.0
│  ├─ rmc-notification@~1.0.0
│  ├─ rmc-nuka-carousel@~3.0.0
│  ├─ rmc-picker@~5.0.0
│  ├─ rmc-pull-to-refresh@~1.0.1
│  ├─ rmc-steps@~1.0.0
│  ├─ rmc-tabs@~1.2.0
│  ├─ rmc-tooltip@~1.0.0
│  └─ rn-topview@^0.1.6

When I downgrade to version 2.1.3, the problem just gone.

I meet the same problem this is demo adress https://codepen.io/djlxiaoshi/pen/PQwNJN

@6769 This is indeed a problem in the new version.

Was this page helpful?
0 / 5 - 0 ratings