You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
30 lines
870 B
30 lines
870 B
<script setup lang="ts">
|
|
import { BehaviorSubject, interval, map, startWith, scan } from "rxjs";
|
|
import { onMounted, onUnmounted, watch } from "vue";
|
|
import { useSubject, useObservable } from "@vueuse/rxjs";
|
|
|
|
const countSubject = new BehaviorSubject(0);
|
|
const count = useSubject(countSubject);
|
|
|
|
const count2 = useObservable(
|
|
interval(1000).pipe(
|
|
map(() => 1),
|
|
startWith(0),
|
|
scan((total, next) => next + total)
|
|
)
|
|
);
|
|
|
|
onMounted(() => {
|
|
watch(count, value => console.info("from watcher:", value));
|
|
|
|
const subscription = countSubject.subscribe(value => console.info("from subscriber: ", value));
|
|
onUnmounted(() => {
|
|
subscription.unsubscribe();
|
|
});
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<button class="btn-fill px-4 py-2 rounded-lg" @click="count++">count is: {{ count }}</button>
|
|
<button class="btn-fill px-4 py-2 rounded-lg">count is: {{ count2 }}</button>
|
|
</template>
|