Vue技巧系列：常用技巧

天然玩家

于 2021-02-28 11:44:40 发布

阅读量135

点赞数 1

分类专栏： # Vue ABC 文章标签： Vue

本文链接：https://blog.csdn.net/Xin_101/article/details/114214452

版权

Vue ABC 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

1 下拉框数据绑定

<select v-model="num">
    <option :value="optionValue" v-for="optionValue in optionValues">{{ optionValue }}</option>
</select>

2 动态路由加载

引入组件时，直接
import component-name from “./path”
不需要加{}。

<template>
    <div class="dashboard-container">
        <charts></charts>
    </div>
</template>

<script>
import { mapGetters } from "vuex"
import  charts  from "./charts"

export default {
    name: "Dashboard",
    components: { charts },
    data() {
        return {
        }
        
    },
    computed: {
        ...mapGetters([
            "name"
        ])
    }
  
}
</script>

<style lang="scss" scoped>
.dashboard {
    &-container {
        margin: 30px;
    }
    &-text {
        font-size: 30px;
        line-height: 46px;
    }
}
</style>