of
был давно, это порождающий оператор Observable.ofasync function runPromisesInSequence(promises) {
const delay = () => new Promise(resolve => setTimeout(resolve, 3000));
for (let promise of promises) {
console.log(await Promise.all([promise, delay()]), new Date());
}
}
const pr1 = new Promise(res => setTimeout(() => res('r1'), 1000));
const pr2 = new Promise(res => setTimeout(() => res('r2'), 5000));
const pr3 = new Promise(res => setTimeout(() => res('r3'), 0));
const y = [pr1, pr2, pr3];
runPromisesInSequence(y);
Нужно вызвать промисы из массива последовательно с минимальной задержкой между вызовами в 3 секунды
new Vue ({})
(function() {
return new Vue({
data: { a: this.om },
})
}).bind({om: 'Привет'})()
$data.a = 'Привет'
методы могут обращаться к this.element внутри data, а объекты внутри data - не могут.
mounted () {
axios.get('http://' + window.location.host + '/api/tokens_VMP/')
.then(({ data }) => this.tokens_VMP = data)
.catch((error) => console.log(error));
},
Тоже самое вставляю в App.vue в тег script - Vue is not defined.
render: h => h(App)
- Vue знает, что делать с такими объектами. Vue.component('friend', { props: ['friend'], filters: { fullName(name) { return `${name.first} ${name.last}`; } }, methods: { decrementAge(friend) { return friend.age -= 1; }, incrementAge(friend) { return friend.age += 1; } }, template: ` <div> <h3>{{ friend.age }}</h3> <input v-model="friend.first" /> <input v-model="friend.last" /> <button v-on:click="decrementAge(friend)"> - </button> <button v-on:click="incrementAge(friend)"> + </button> </div> ` });
data: { friends: [ { first: 'Bobby', last: 'Down', age: 25 }, { first: 'John', last: 'Dowson', age: 38 } ] },
export default {}
<div class="center"> <friend v-for="friend in friends" v-bind:friend="friend"/> </div>
<template></template>
в App.vue Значит писать в app.vue и всё, как обычно, и , получается, внутри export default ?
<template><div>Helloworld</div></template>
Да, но я уточнил, что мне не нужно создавать компоненты. Я хочу просто попрактиковаться и пока что не хочу усложнять. Пока что просто в одном файле, как в классических примерах. Попробовать все эти простые штуки с v-for, click и т.д.
В App.vue у вас корневой компонент (разметка и код)
const app = new Vue ({
el: '#app',
template: ``
и т.д.
import { Subject, of, Observable } from 'rxjs';
import { delay } from 'rxjs/operators';
export class Queue {
private additions: Observable<any>[] = [];
private queue$ = new Subject<Observable<any>[]>();
private clear$ = new Subject<void>();
private queue: Observable<any>[] = [];
constructor() {
this.queue$.subscribe(q => this.queue = q);
this.queue$.subscribe(() => {
this.queue = this.queue.concat(this.additions);
this.additions = [];
if (!this.queue.length) {
this.clear$.next();
} else {
this.queue.shift().subscribe(res => {
console.log(res, ' to do:', this.queue.length + this.additions.length);
this.queue$.next(this.queue );
});
}
});
this.clear$.subscribe(() => {
console.log('done');
})
}
public addTask (...args) {
this.additions = this.additions.concat(args);
console.log('-- added:', this.additions.length, 'total: ', this.queue.length + this.additions.length);
if (!this.queue.length) {
this.queue$.next(this.queue);
}
}
public done() {
return this.clear$.asObservable();
}
public nextWill() {
return this.queue[0];
}
public count() {
return this.queue.length;
}
}
const queue = new Queue();
queue.addTask(
of('itemA').pipe(delay(1000)),
of('itemB').pipe(delay(1000)),
of('itemC').pipe(delay(1000)),
of('itemD').pipe(delay(10)),
);
queue.addTask(
of('itemE').pipe(delay(1000)),
of('itemF').pipe(delay(1000)),
of('itemG').pipe(delay(1000)),
of('itemH').pipe(delay(10)),
);
setTimeout(() => {
queue.addTask(of('itemI').pipe(delay(1000)));
}, 10000);