Skip to content

Instantly share code, notes, and snippets.

View chentsulin's full-sized avatar
🕶️
Keep learning

C. T. Lin chentsulin

🕶️
Keep learning
View GitHub Profile
@chentsulin
chentsulin / Counter.js
Created November 5, 2018 15:26
counter hooks
const Counter = ({ defaultValue }) => {
const [count, setCount] = useState(defaultValue);
const handlePlusOne = () => {
setCount(count + 1);
}
return (
<>
<div>{count}</div>
@chentsulin
chentsulin / Counter.js
Created November 5, 2018 15:25
counter powerplug
import { Counter as PCounter } from 'react-powerplug'
const Counter = ({ defaultValue }) => {
return (
<PCounter initial={defaultValue}>
{({ count, inc }) => (
<>
<div>{count}</div>
<button onClick={inc}>+</button>
@chentsulin
chentsulin / Counter.js
Last active November 6, 2018 02:10
counter class
class Counter {
state = {
value: this.props.defaultValue
};
handlePlusOne = () => {
this.setState(() => ({ value: this.state.value + 1 }));
};
render() {
@chentsulin
chentsulin / Counter.js
Created November 5, 2018 15:21
init counter
const Counter = ({ defaultValue }) => {
return (
<>
<div>{defaultValue}</div>
<button>+</button>
</>
);
};
@chentsulin
chentsulin / App.js
Last active November 5, 2018 14:40
hooks-useEffect
const App = ({ userId }) => {
useEffect(() => {
subscribe(userId);
return () => {
unsubscribe(userId);
};
}, [userId]);
// ...
};
@chentsulin
chentsulin / App.js
Created November 5, 2018 14:34
Lifecycle
class App extends Component {
componentDidMount() {
this.subscribe(this.props.userId);
}
componentDidUpdate(prevProps) {
if (this.props.userId !== prevProps.userId) {
this.unsubscribe(this.props.userId);
this.subscribe(this.props.userId);
}
@chentsulin
chentsulin / App.js
Last active November 6, 2018 03:18
renderProps-Context
const App = () => {
return (
<ThemeContext.Consumer>
{theme => (
<LocaleContext.Consumer>
{locale => (
<div className={theme}>
{locale}
</div>
)}
@chentsulin
chentsulin / App.js
Created November 5, 2018 14:15
hooks-useContext
const App = () => {
const theme = useContext(ThemeContext);
const locale = useContext(LocaleContext);
return (
<div className={theme}>
{locale}
</div>
);
};
@chentsulin
chentsulin / App.js
Last active November 5, 2018 14:16
hooks-useState
const App = () => {
const [name, setName] = useState('');
const [email, setEmail] = useState('');
const handleNameChange = event => {
setName(event.target.value);
};
const handleEmailChange = event => {
setEmail(event.target.value);
};
client.sendImagemap(userId, 'Re: [問卦] 齊柏林導演的故事給了我們什麼啟示?', {
baseWidth: 1040,
baseHeight: 720,
baseUrl: 'https://our.image.com/server/path',
actions: [
{
type: 'uri',
linkUri: 'https://www.ptt.cc/bbs/Gossiping/M.1497100764.A.C81.html',
area: {
x: 0,