vue项目笔记（24）-小插曲（零碎知识点整理）

川长思鸟来 2021-09-16 03:28 266阅读 0赞

**知识点1：背景渐变设置**

background-image linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8))

**知识点2：子级元素水平垂直居中的样式（.container表示父级元素）**

.container
        display flex
        flex-direction column
        justify-content center

**知识点3：vue组建中的name通常是干什么用的？**

（1）name可以用于递归组件。

// DetailList.vue组件
          <div v-if="item.children" class="item-children">
            <detail-list :list="item.children"></detail-list>
          </div>

（2）name可以用于取消组件的缓存。示例如下：

// App.vue组件
        <keep-alive exclude="Detail">
            <router-view/>
        </keep-alive>

（3）vue-devtools调试工具中显示的组件，即name。

**知识点4：滚动行为**

vue项目中，一个页面产生了滚动，而后跳转到另一个页面的时候，该页面也会和之前页面的滚动位置一样，很不方便。解决方法：在router/index.js中加入以下代码

export default new Router({
      routes: [{
        path: '/',
        name: 'Home',
        component: Home
      }, {
        path: '/city',
        name: 'City',
        component: City
      },{
        path: '/detail/:id',
        name: 'Detail',
        component: Detail
      }],
      // 滚动行为
      scrollBehavior (to, from, savedPosition) {
        return { x: 0, y: 0 }
      }
    })

发表评论取消回复

表情：

评论列表（有 0 条评论，266人围观）

还没有评论，来说两句吧...

相关阅读

相关零碎知识点

`4.1` 字符串转int（负数） ![在这里插入图片描述][820a97883c8446e29b808f24af5d52ab.png] > 首先是Arrays.st

淩亂°似流年/ 2023年09月26日 19:41/ 0 赞/ 136 阅读

相关 MySQL零碎知识点整理

> 本篇博文是本人在多个渠道收集到的有关MySQL的零碎知识点的整理，包括但不仅限于CSDN，简书，微信公众号等各种渠道。甚至有些文章无法考证原创作者。故在此标记为原创，如有侵

﹏ヽ暗。殇╰゛Y/ 2022年12月02日 15:13/ 0 赞/ 195 阅读

相关零碎知识点

零碎知识点 Linux传输文件的命令有哪些？ -------------------- Linux传输文件的命令有哪些？答： 1.传输文件可以用 `

忘是亡心i/ 2022年09月08日 03:52/ 0 赞/ 287 阅读

相关零碎知识点

[IE浏览器下，输入框最后不显示X][IE_X] IE浏览器下，输入框最后不显示X。设置： .login-input::-ms-clear \{ display:

ゝ一纸荒年。/ 2022年06月05日 01:28/ 0 赞/ 283 阅读

相关微信小程序零碎知识点

1、在wxml中只有用text标签包裹的文本才能在手机上长按选中 -------------------- 2、小程序的自适应单位是rpx，一般情况下不要使用px

待我称王封你为后i/ 2022年05月31日 09:49/ 0 赞/ 750 阅读

相关 java零碎知识点整理

System.out.println((char)97);//a InputStream有：read() , read(byte\[\] a) , read(byt

柔情只为你懂/ 2022年05月12日 23:40/ 0 赞/ 291 阅读

相关零碎知识点

记录一些零碎，里面有助于理解的是从各处找来的：） 1.【C++】下面代码执行的输出结果 class BASE{ public: ~BASE()

深碍√TFBOYSˉ_/ 2022年02月25日 11:52/ 0 赞/ 360 阅读

相关响应式网站设计（4）-小插曲（零碎知识点）

知识点1：class与id属性的选择标准 > 一般选用class定义样式，id一般用于js快速的区别和获取元素；class一般使用中横杠连接，id一般使用驼峰命名法。

左手的ㄟ右手/ 2021年09月16日 04:20/ 0 赞/ 325 阅读

相关 vue项目笔记（24）-小插曲（零碎知识点整理）

知识点1：背景渐变设置 background-image linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0,

川长思鸟来/ 2021年09月16日 03:28/ 0 赞/ 267 阅读

相关微信小程序零碎知识点

1、wx:if 和 hidden 当标签不是频繁切换显示的时候：优先使用wx:if 直接把标签从页面结构给移除掉当标签频繁的切换显示的时候：优先使用hidden...

系统管理员/ 2021年02月26日 02:04/ 0 赞/ 713 阅读