问题
The select field can be found here: in the Material-UI demo
It's methods appear to be inherited from the menu / popover classes but I haven't been able to figure out how to fire 'open' when onFocus event fires for example. This would solve my keyboard related usability issues!
回答1:
You could do it by accessing the DOM node of the down arrow button, and manually triggering a click event on it.
Example that works on Mac Chrome on the demo website, via the console, after adding a 'mySelect' id field to the select field DOM element for easier access:
// Initialize a click event (mouseup seem more cross browser)
var evt = document.createEvent('MouseEvents');
evt.initEvent('mouseup', true, false);
// The down arrow elment is the only SVG element un the select
var elm = document.querySelector('#mySelect svg')
// Dispatch the event (reusable)
elm.dispatchEvent(evt);
If this solution fits your code, you'll have to check the full cross browser/platform way to create te proper event, and to select the arrow element (querySelector
is not available everywhere, although it's quite OK now)
来源:https://stackoverflow.com/questions/35585727/how-does-one-programmatically-open-a-material-ui-select-field