Skip to content

Commit 3b09a0d

Browse files
committed
website: update example.
1 parent c313dca commit 3b09a0d

File tree

3 files changed

+10
-6
lines changed

3 files changed

+10
-6
lines changed

README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ CodeMirror component for React. Demo Preview: [@uiwjs.github.io/react-codemirror
1414
**Features:**
1515

1616
🚀 Quickly and easily configure the API.
17-
🌱 Use [codemirror 6](https://github.com/uiwjs/react-codemirror/issues/88).
17+
🌱 Use [codemirror 6](https://codemirror.net/6/). [#88](https://github.com/uiwjs/react-codemirror/issues/88).
1818
⚛️ Support the features of React Hook(requires React 16.8+).
1919
📚 Use Typescript to write, better code hints.
2020
🌎 There are better [sample previews](https://uiwjs.github.io/react-codemirror).

website/App.module.less

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -120,6 +120,9 @@ body {
120120
.footer {
121121
text-align: center;
122122
padding-top: 30px;
123+
a {
124+
text-decoration: none;
125+
}
123126
}
124127

125128
.codemirror {

website/App.tsx

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -25,10 +25,6 @@ import { Select } from './Select';
2525
const langs: Record<string, any> = { javascript, html, css, json, python, markdown, xml, sql, java, rust, cpp, lezer, php };
2626

2727
const hyperlink: { href: string; label: string; style?: React.CSSProperties; }[] = [
28-
{
29-
href: 'https://github.com/uiwjs/react-codemirror',
30-
label: 'View on GitHub',
31-
},
3228
{
3329
href: 'https://www.npmjs.com/package/@uiw/react-codemirror',
3430
label: 'View on NPM',
@@ -51,6 +47,9 @@ const hyperlink: { href: string; label: string; style?: React.CSSProperties; }[]
5147
const themeOptions = [ 'dark', 'light' ];
5248
const heightOptions = [ 'auto', '200px', '300px', '500px' ];
5349

50+
51+
let count = 0
52+
5453
export default function App() {
5554
const [mode, setMode] = useState('javascript');
5655
const [theme, setTheme] = useState<ReactCodeMirrorProps['theme']>('light');
@@ -120,7 +119,9 @@ export default function App() {
120119
<Select label="Lang" options={Object.keys(langs)} value={mode} onChange={(evn) => handleLangChange(evn.target.value)} />
121120
<Select label="Theme" options={themeOptions} value={theme} onChange={(evn) => setTheme(evn.target.value as ReactCodeMirrorProps['theme'])} />
122121
<Select label="Height" options={heightOptions} value={height} onChange={(evn) => setHeight(evn.target.value)} />
123-
<button onClick={() => setCode('console.log("Hello World!")')}>
122+
<button onClick={() => {
123+
count++; setCode(`console.log("Hello World! ${count}")`);
124+
}}>
124125
change code
125126
</button>
126127
</div>

0 commit comments

Comments
 (0)