MirroredRepos/bat
1
0
Fork 0
mirror of https://github.com/sharkdp/bat.git synced 2025-10-29 22:24:35 +00:00
Code Issues Releases Wiki Activity

Add tests for Vue component syntax

Browse Source
This commit is contained in:
Tommaso Pifferi
2020-10-20 09:43:45 +02:00
committed by David Peter
parent 5ec4936a4f
commit cc6f6fdb1d
2 changed files with 110 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
tests/syntax-tests/highlighted/Vue/example.vue Normal file
View File

@@ -0,0 +1,55 @@
<template>
 <div id="app" class="container-fluid">
 <AppHeader></AppHeader>
 <transition name="page" mode="out-in" v-if="!isLoading">
 <router-view></router-view>
 </transition>
 <AppLoadingIndicator></AppLoadingIndicator>
 </div>
</template>
<script>
import AppHeader from "@/components/AppHeader";
import AppLoadingIndicator from "@/components/AppLoadingIndicator";
import { mapGetters } from "vuex";
export default {
 name: "App",
 components: {
 AppHeader,
 AppLoadingIndicator,
 },
 beforeCreate() {
 this.$store.dispatch("fetchData");
 },
 data: {
 message: "Hello!"
 },
 computed: {
 ...mapGetters({
 isLoading: "isLoading",
 }),
 },
};
</script>
<style>
body {
 background-color: rgba(72, 163, 184, 0.05) !important;
}
.page-enter-active,
.page-leave-active {
 transition: opacity 0.2s;
}
.page-enter,
.page-leave-active {
 opacity: 0;
}
.page-enter:hover {
 opacity: 1;
}
</style>

55
tests/syntax-tests/source/Vue/example.vue Normal file
View File

@@ -0,0 +1,55 @@
<template>
<div id="app" class="container-fluid">
<AppHeader></AppHeader>
<transition name="page" mode="out-in" v-if="!isLoading">
<router-view></router-view>
</transition>
<AppLoadingIndicator></AppLoadingIndicator>
</div>
</template>
<script>
import AppHeader from "@/components/AppHeader";
import AppLoadingIndicator from "@/components/AppLoadingIndicator";
import { mapGetters } from "vuex";
export default {
name: "App",
components: {
AppHeader,
AppLoadingIndicator,
},
beforeCreate() {
this.$store.dispatch("fetchData");
},
data: {
message: "Hello!"
},
computed: {
...mapGetters({
isLoading: "isLoading",
}),
},
};
</script>
<style>
body {
background-color: rgba(72, 163, 184, 0.05) !important;
}
.page-enter-active,
.page-leave-active {
transition: opacity 0.2s;
}
.page-enter,
.page-leave-active {
opacity: 0;
}
.page-enter:hover {
opacity: 1;
}
</style>