# Typescript
# Introduction
Vuescrol has added support for typescript in the 4.6.11 version. You can quickly input the Api of Vuescroll with the help of the typscript type inference.
# Usage
Install Vuescroll.
importVuescroll in the single file component where you use Vuescroll, like so:
<template>
<div class="home">
<vue-scroll ref="vs">
<HelloWorld msg="Welcome to Your Vue.js + TypeScript App"/>
</vue-scroll>
</div>
</template>
<script lang="ts">
import Vue from 'vue';
import HelloWorld from '@/components/HelloWorld.vue'; // @ is an alias to /src
import vuescroll from 'vuescroll';
export default Vue.extend({
name: 'home',
data() {},
created() {
// The as symbol is used to tell the compiler that this is vuescroll
const vs = this.$refs['vs'] as vuescroll;
}
});
</script>
- Inference of
Config
<template>
<div class="home">
<vue-scroll :ops="ops">
<HelloWorld msg="Welcome to Your Vue.js + TypeScript App"/>
</vue-scroll>
</div>
</template>
<script lang="ts">
import Vue from 'vue';
import HelloWorld from '@/components/HelloWorld.vue'; // @ is an alias to /src
import { Config } from 'vuescroll';
const ops: Config = {
// Your own options
};
export default Vue.extend({
name: 'home',
data() {
return {
ops: ops
};
}
});
</script>
