Vue 滚动条动画

<template>

    <div class="home-main">

        <div class="progress-main">

            <div class="progress-content" :style="{width: width100}"></div>

        </div>

    </div>

</template>

<script>

export default {

    name: 'home',

    data() {

        return {

            width100: ,

        };

    },

    mounted() {

        setTimeout(() => {

            this.width100 = '80%';

        }, );

    },

};

</script>

<style lang="stylus" scoped>

.home-main

    width %

    height %

    overflow hidden

    position relative

    .progress-main{

        border-radius 100px

        background-color #ebeef5

        overflow hidden

        position relative

        width 200px

        height 10px

        margin 20px   20px

        .progress-content{

            position absolute

            left

            top

            height %

            background-color #409eff

            border-radius 100px

            transition width 1s ease

        }

    }

</style>