提交 5bd21869 编写于 作者: O oasis-cloud

chore: doc 支持增量在线调试

上级 edf4dc83
...@@ -16,7 +16,8 @@ import { Button } from '@nutui/nutui-react'; ...@@ -16,7 +16,8 @@ import { Button } from '@nutui/nutui-react';
按钮支持 `default``primary``info``warning``danger``success` 六种类型,默认为 `default` 按钮支持 `default``primary``info``warning``danger``success` 六种类型,默认为 `default`
```html :::demo
```tsx
<Button type="primary">主要按钮</Button> <Button type="primary">主要按钮</Button>
<Button type="info">信息按钮</Button> <Button type="info">信息按钮</Button>
<Button type="default">默认按钮</Button> <Button type="default">默认按钮</Button>
...@@ -24,6 +25,7 @@ import { Button } from '@nutui/nutui-react'; ...@@ -24,6 +25,7 @@ import { Button } from '@nutui/nutui-react';
<Button type="warning">警告按钮</Button> <Button type="warning">警告按钮</Button>
<Button type="success">成功按钮</Button> <Button type="success">成功按钮</Button>
``` ```
:::
### 朴素按钮 ### 朴素按钮
......
...@@ -57,3 +57,12 @@ ...@@ -57,3 +57,12 @@
} }
} }
} }
.nutui-react--demo-button {
display: none;
}
.nutui-react--demo-wrapper {
.nutui-react--demo-button {
display: block;
}
}
...@@ -22,7 +22,7 @@ function myRemarkPlugin() { ...@@ -22,7 +22,7 @@ function myRemarkPlugin() {
data.hName = 'div' data.hName = 'div'
data.hProperties = { data.hProperties = {
class: 'demo', class: 'nutui-react--demo-wrapper',
} }
} }
}) })
...@@ -46,6 +46,7 @@ const App = () => { ...@@ -46,6 +46,7 @@ const App = () => {
remarkPlugins={[remarkGfm, remarkDirective, myRemarkPlugin]} remarkPlugins={[remarkGfm, remarkDirective, myRemarkPlugin]}
components={{ components={{
code({ node, inline, className, children, ...props }) { code({ node, inline, className, children, ...props }) {
console.log('props', node)
const match = /language-(\w+)/.exec(className || '') const match = /language-(\w+)/.exec(className || '')
return !inline && match ? ( return !inline && match ? (
<Demoblock text={String(children).replace(/\n$/, '')}> <Demoblock text={String(children).replace(/\n$/, '')}>
......
...@@ -3,12 +3,10 @@ interface A { ...@@ -3,12 +3,10 @@ interface A {
text: string text: string
} }
const DemoBlock: React.FunctionComponent<A> = (props) => { const DemoBlock: React.FunctionComponent<A> = (props) => {
console.log(props.children)
return ( return (
<> <>
{props.children} {props.children}
{props.text} <div className="nutui-react--demo-button">{props.text}</div>
xxxx
</> </>
) )
} }
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册