赞
踩
官网: http://www.material-ui.com/#/
github: https://github.com/callemall/material-ui
PC 官网: https://ant.design/index-cn
移动官网: https://mobile.ant.design/index-cn
Github: https://github.com/ant-design/ant-design/
Github: https://github.com/ant-design/ant-design-mobile/
npm install create-react-app -g
create-react-app antm-demo
cd antm-demo
npm start
npm install antd-mobile --save
import React, {Component} from 'react'
// 分别引入需要使用的组件
import Button from 'antd-mobile/lib/button'
import Toast from 'antd-mobile/lib/toast'
export default class App extends Component {
handleClick = () => {
Toast.info(' 提交成功', 2)
}
render() {
return (
<div>
<Button type="primary" onClick={this.handleClick}>提交</Button>
</div>
)
}
}
import React from 'react';
import ReactDOM from 'react-dom'
import App from "./App"
// 引入整体 css
import 'antd-mobile/dist/antd-mobile.css'
ReactDOM.render(<App />, document.getElementById('root'))
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1,
minimum-scale=1, user-scalable=no" />
<script
src="https://as.alipayobjects.com/g/component/fastclick/1.0.6/fastclick.js"></scrip
t>
<script>
if ('addEventListener' in document) {
document.addEventListener('DOMContentLoaded', function() {
FastClick.attach(document.body);
}, false);
}
if(!window.Promise) {
document.writeln('<script
src="https://as.alipayobjects.com/g/component/es6-promise/3.2.2/es6-promise.min.js"
'+'>'+'<'+'/'+'script>');
}
</script>
yarn add react-app-rewired --dev
yarn add babel-plugin-import --dev
npm install react-app-rewired customize-cra --save-dev
package.json
"scripts": {
"start": "react-app-rewired start",
"build": "react-app-rewired build",
"test": "react-app-rewired test --env=jsdom"
}
config-overrides.js
const { override, fixBabelImports } = require('customize-cra');
module.exports = override(
fixBabelImports('import', {
libraryName: 'antd-mobile',
style: 'css',
}),
);
// import 'antd-mobile/dist/antd-mobile.css'
// import Button from 'antd-mobile/lib/button'
// import Toast from 'antd-mobile/lib/toast'
import {Button, Toast} from 'antd-mobile'
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。