禁用所有 material-ui 组件的拼写检查

soo*_*kie 3 javascript reactjs material-ui

有没有办法全局禁用material-ui组件的拼写检查?

在使用该material-ui库之前,我使用以下代码段禁用所有新创建的 DOM 元素的拼写检查:

const disableSpellCheck = function(mutations) 
{
    const mutationCount = mutations.length;

    for (let i = 0; i < mutationCount; i++) {
        const mutation = mutations[i];
        if (mutation.attributeName === "spellcheck") {
            const addedNodes = mutation.addedNodes;
            const nodeCount = addedNodes.length;

            for (let n = 0; n < nodeCount; n++) {
                addedNodes[n].setAttribute("spellcheck", "false");
            }
        }
    }
}

const observer = new MutationObserver(disableSpellCheck);

observer.observe(document.getElementById('root'), {
    childList: true, 
    subtree: true,
    attributes: true, 
    attributeFilter: ['spellcheck']
});
Run Code Online (Sandbox Code Playgroud)

这似乎不适用于material-ui. 因为在应用程序范围内禁用拼写检查至关重要,所以我正在寻找一种不涉及单独修改每个组件的样式的解决方案。

Est*_*ask 6

为了做到这一点,spellCheck应该向输入提供 prop。

这可以在 Material UI 中使用:

<Input inputProps={{ spellCheck: 'false' }}/>
Run Code Online (Sandbox Code Playgroud)

默认道具可以应用于具有主题的所有输入:

const theme = createMuiTheme({
  props: {
    MuiInput: { inputProps: { spellCheck: 'false' } }
  }
});

...

<MuiThemeProvider theme={theme}>...</MuiThemeProvider>
Run Code Online (Sandbox Code Playgroud)