feat(docs): InfiniteScroll code for composition (#2193)

Co-authored-by: 无星 <32910694@qq.com>
This commit is contained in:
Xing.Wu 2021-06-10 00:23:50 +08:00 committed by GitHub
parent be2e8a0f22
commit 797b978f76
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 250 additions and 0 deletions

View File

@ -26,6 +26,26 @@ Add `v-infinite-scroll` to the list to automatically execute loading method when
}
}
</script>
<!--
<setup>
import { defineComponent, ref } from 'vue';
export default defineComponent({
setup() {
const count = ref(0);
const load = () => {
count.value += 2;
};
return {
count,
load,
};
},
});
</setup>
-->
```
:::
@ -73,6 +93,36 @@ Add `v-infinite-scroll` to the list to automatically execute loading method when
}
}
</script>
<!--
<setup>
import { defineComponent, ref, computed } from 'vue';
export default defineComponent({
setup() {
const count = ref(10);
const loading = ref(false);
const noMore = computed(() => count.value >= 20);
const disabled = computed(() => loading.value || noMore.value);
const load = () => {
loading.value = true;
setTimeout(() => {
count.value += 2;
loading.value = false;
}, 2000);
};
return {
count,
loading,
noMore,
disabled,
load,
};
},
});
</setup>
-->
```
:::

View File

@ -27,6 +27,26 @@ Añada `v-infinite-scroll` a la lista para ejecutar automáticamente el método
}
}
</script>
<!--
<setup>
import { defineComponent, ref } from 'vue';
export default defineComponent({
setup() {
const count = ref(0);
const load = () => {
count.value += 2;
};
return {
count,
load,
};
},
});
</setup>
-->
```
:::
@ -74,6 +94,36 @@ Añada `v-infinite-scroll` a la lista para ejecutar automáticamente el método
}
}
</script>
<!--
<setup>
import { defineComponent, ref, computed } from 'vue';
export default defineComponent({
setup() {
const count = ref(10);
const loading = ref(false);
const noMore = computed(() => count.value >= 20);
const disabled = computed(() => loading.value || noMore.value);
const load = () => {
loading.value = true;
setTimeout(() => {
count.value += 2;
loading.value = false;
}, 2000);
};
return {
count,
loading,
noMore,
disabled,
load,
};
},
});
</setup>
-->
```
:::

View File

@ -26,6 +26,26 @@ Ajoutez `v-infinite-scroll` à la liste pour exécuter automatiquement la métho
}
}
</script>
<!--
<setup>
import { defineComponent, ref } from 'vue';
export default defineComponent({
setup() {
const count = ref(0);
const load = () => {
count.value += 2;
};
return {
count,
load,
};
},
});
</setup>
-->
```
:::
@ -73,6 +93,36 @@ Ajoutez `v-infinite-scroll` à la liste pour exécuter automatiquement la métho
}
}
</script>
<!--
<setup>
import { defineComponent, ref, computed } from 'vue';
export default defineComponent({
setup() {
const count = ref(10);
const loading = ref(false);
const noMore = computed(() => count.value >= 20);
const disabled = computed(() => loading.value || noMore.value);
const load = () => {
loading.value = true;
setTimeout(() => {
count.value += 2;
loading.value = false;
}, 2000);
};
return {
count,
loading,
noMore,
disabled,
load,
};
},
});
</setup>
-->
```
:::

View File

@ -26,6 +26,26 @@
}
}
</script>
<!--
<setup>
import { defineComponent, ref } from 'vue';
export default defineComponent({
setup() {
const count = ref(0);
const load = () => {
count.value += 2;
};
return {
count,
load,
};
},
});
</setup>
-->
```
:::
@ -73,6 +93,36 @@
}
}
</script>
<!--
<setup>
import { defineComponent, ref, computed } from 'vue';
export default defineComponent({
setup() {
const count = ref(10);
const loading = ref(false);
const noMore = computed(() => count.value >= 20);
const disabled = computed(() => loading.value || noMore.value);
const load = () => {
loading.value = true;
setTimeout(() => {
count.value += 2;
loading.value = false;
}, 2000);
};
return {
count,
loading,
noMore,
disabled,
load,
};
},
});
</setup>
-->
```
:::

View File

@ -26,6 +26,26 @@
}
}
</script>
<!--
<setup>
import { defineComponent, ref } from 'vue';
export default defineComponent({
setup() {
const count = ref(0);
const load = () => {
count.value += 2;
};
return {
count,
load,
};
},
});
</setup>
-->
```
:::
@ -73,6 +93,36 @@
}
}
</script>
<!--
<setup>
import { defineComponent, ref, computed } from 'vue';
export default defineComponent({
setup() {
const count = ref(10);
const loading = ref(false);
const noMore = computed(() => count.value >= 20);
const disabled = computed(() => loading.value || noMore.value);
const load = () => {
loading.value = true;
setTimeout(() => {
count.value += 2;
loading.value = false;
}, 2000);
};
return {
count,
loading,
noMore,
disabled,
load,
};
},
});
</setup>
-->
```
:::