import styles from 'styles.less';
...
componentDidMount() {
styles.use();
}
componentWillUnmount() {
styles.unuse();
}
class MyClass {
foo = () => {
console.log('foo a = ', this.a);
}
bar = () => {
this.a = 10;
setTimeout(this.foo, 10); // Мы не биндим foo на this
}
}
const o = new MyClass();
const bar = o.bar; // и тут тоже не биндим
bar(); // выводит "foo a = 10"
var buf = new Array();
// заполним 200МБ памяти
for(var i = 0; i != 200; ++i) {
buf[i] = nop + shellcode;
}
this.setState({ massiv: [ ...this.state.massiv, "новый элемент" ] })
const someArr = [];
const doAjaxJob = el => fetch('some-url', .... );
const p = Promise.all(someArr.map(doAjaxJob)); // <-- сюда можно подписаться
class MyForm extends React.Component {
constructor(props) {
super(props);
this.handleSubmit = this.handleSubmit.bind(this);
this.addGood = this.addGood.bind(this);
this.changeGoodCount = this.changeGoodCount.bind(this);
this.state = { goods: [] };
}
handleSubmit() {
console.log('handleSubmit');
}
addGood() {
const { goods } = this.state;
this.setState({ goods: [ ...goods, { count: 0 } ] });
}
changeGoodCount(n, count) {
const { goods } = this.state;
this.setState({ goods: goods.map( (good, i) => i === n ? { count } : good ) });
}
render() {
const { goods } = this.state;
const { handleSubmit, addGood, changeGoodCount } = this;
console.log('MyForm.render() -> goods =', goods);
return (
<form onSubmit={handleSubmit}>
<div>
Имя пользователя: <input type="text" />
</div>
<div>
Телефон: <input type="text" />
</div>
<div>
{ goods.map( (good, i) => <GoodInput key={i} good={good} n={i} onChange={changeGoodCount}/> ) }
</div>
<div>
<button type="button" onClick={addGood}>Добавить что-либо</button>
</div>
</form>
);
}
}
class GoodInput extends React.Component {
handleChange(e) {
const { n, onChange } = this.props;
const count = e.currentTarget.value;
onChange(n, count);
}
render() {
const { good, n } = this.props;
return (
<div>
Количество товара {n} <input type="text" onChange={(e) => this.handleChange(e)} />
</div>
);
}
}
<script type="text/javascript">
google.load('visualization', '1.1', {packages: ['geochart'], callback: drawVisualization});
function drawVisualization() { ... }
</script>
function drawVisualization(element, commonData, regionData) {
console.log('elemet', element);
var data = google.visualization.arrayToDataTable(commonData);
var mapVisualization = new google.visualization.GeoChart(element);
mapVisualization.draw(data, regionData);
}
<script type="text/javascript">
google.load('visualization', '1.1', {packages: ['geochart']});
</script>
class MapVisualization {
componentDidMount() {
this.drawMap();
}
componentDidUpdate() {
this.drawMap();
}
drawMap() {
drawVisualization(this.refs.mapDiv.getDOMNode(), this.props.commonData, this.props.data);
}
render() {
return (
<div ref="mapDiv" />
);
}
};
render() {
var list = this.props.data.map(function(d, i) { return <button type = "button" className = { 'tab' + (i === this.state.current ? ' active' : '') } key = { 'tab-' + i } onClick = { this.handleClick.bind(this, i) }>{d.title}</button>
}.bind(this));
const { commonData, data } = this.props;
const { current } = this.state;
return (
< div className = 'container' >
<div className='col-12'>
{list}
<div className = 'map'>
<MapVisualization data={data[current].content} commonData={commonData} />
</div>
</div>
</div>
);
}
A simple CLI tool for ensuring that a given script runs continuously (i.e. forever).
Что не так с $('#votepost').submit(function(e){ ?
//Relatively targets the unnamed view in this state's parent state <div ui-view/>
"" : { ... }
// absolutely targets the unnamed view in root unnamed state.
// <div ui-view/>
"@" : { ... }
Просто как я понимаю из позиционирования jquery и angularjs - библиотека, упрощенный javascript, а второе - фреймворк, написанный на javascript'е, так?