|
- <template>
- <div :class="inPage ? 'page active' : 'page'">
- <div id="top"></div>
- <!-- 主体内容 -->
- <div class="contnet">
- <!-- 头部 -->
- <div class="head">
- <img src="" alt="">
- <div>退出聊天</div>
- </div>
- </div>
- </div>
- </template>
-
- <script>
- // 组件
- import Vue from "vue";
- import { Toast } from "vant";
- import { mapState, mapActions } from "vuex";
- // 工具
- import { scrollToID } from "../../utils";
-
- Vue.use(Toast);
- export default {
- data() {
- return {
- inPage: false,
- };
- },
- computed: {
- ...mapState({
- characters: (state) => state.publicObj.characters,
- }),
- },
-
- methods: {
- ...mapActions(["setCharacters"]),
-
- go(url) {
- this.$router.push(url);
- },
- },
- created() {},
- mounted() {
- this.inPage = true;
- scrollToID("top");
- },
- };
- </script>
-
- <style lang="scss" scoped>
- .page {
- transform: translateX(30%);
- opacity: 0;
- transition: all 0.5s; // global-transition
- &.active {
- opacity: 1;
- transform: translateX(0);
- }
- }
- </style>
|