GithubHelp home page GithubHelp logo

zhhyang / yep-react Goto Github PK

View Code? Open in Web Editor NEW
88.0 88.0 29.0 27.59 MB

yep react UI component 组件

Home Page: https://zhhyang.github.io/yep-react/

License: MIT License

CSS 2.18% HTML 0.27% JavaScript 25.25% TypeScript 51.21% Shell 0.09% SCSS 20.99%
components-library react typescript ui-components

yep-react's People

Contributors

code-with-joy avatar hanyuxinting avatar hellomax2021 avatar lcl-1987 avatar wk19921225 avatar zhhyang avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

yep-react's Issues

CountDown 倒计时

class Home extends PureComponent<IMyDetailProps, IMyDetailState> {
constructor(props: IMyDetailProps) {
super(props);
this.state = {
seconds: 10,
voteCount: 10
};
}
async componentWillMount() {
let paramInfo = {
activityGroupId: 'vote2020083101'
};
const res = await Service.getFindVoteInfo(paramInfo);
console.log(res);
this.setState({
seconds: res.seconds,
voteCount: res.voteCount
});
}
render() {
const { seconds } = this.state;
return (


{seconds}
{
seconds !== 10 &&

{/* {({dayStr, hourStr, minuteStr, secondStr}) => (


倒计时剩余: {dayStr}天{hourStr}小时{minuteStr}分钟{secondStr}秒


)} */}

}
{this.state.voteCount}


);
}
}
通过接口改值的话,组件不会render,只好加了个判断

倒计时

倒计时结束时不显示结束的场景00:00:00,建议增加此场景功能

Icon图标的按需使用

使用字符串命名设置图标的 API,在这种设计下无法做到按需加载,因而全量引入了 svg 图标文件,这大大增加了打包产物的尺寸。希望在 1.0 中,我们将会对此进行调整以优化体积。

旧版 Icon 使用方式将被废弃:

import { Icon } from '@jdcfe/yep-react';

const App = () => (
  <div>
    <Icon type="bell" />
  </div>
);

1.0 中会采用按需引入的方式:

// 直接使用
import BellIcon from '@jdcfe/yep-icons/BellIcon';

// If tree-shaking supported
import { BellIcon } from '@jdcfe/yep-icons';

const App = () => (
  <div>
    <BellIcon />
  </div>
);

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.