随笔录（二）

路漫漫其修远兮，吾将上下而求索。---《离骚》屈原

say hello~

如何在vue2.x版本中添加微信公众号的标题——不同页面标题不同

下载依赖

    npm install vue-wechat-title --save

在main.js中全局引入VueWechatTitle

    import VueWechatTitle from 'vue-wechat-title';
    Vue.use(VueWechatTitle);

在路由里面添加路由守卫

    router.beforeEach((to,from,next)=>{
    if(to.meta.title){
        window.document.title = to.meta.title
    }
    next();
})

在app.vue中修改代码

  <template>
      <div id="app">
        <keep-alive>
          <router-view v-if="$route.meta.keepAlive" v-wechat-title="$route.meta.title" />
        </keep-alive>
        <router-view v-if="!$route.meta.keepAlive" v-wechat-title="$route.meta.title" />
      </div>
</template>

论如何让form切换的时候，重新验证有效性

    //以vant组件库为例
    <van-form :key="fromKey" label-width="7em" ref="dialog-form">
    </van-form>

    //在打开这个form的方法里，改变fromKey的值
    this.fromKey++;

三种让vue组件重新渲染的方式

1.改变key值 --- 首推之星

组件会重新渲染，实例对应的生命周期函数，计算属性，watch等都会执行。

因为vue是通过虚拟DOM树算法来判断元素的变化，是否变化的核心就是通过判断新旧火元素的key值是否发生改变。如果，key值发生变化，那么就会重新渲染该元素，否则就不会重新渲染该元素。

2.v-if

简单的说：是当v-if的值为false时，当前条件里面的内容就会被销毁，为true的时候，当前内容里面的内容就会冲重新渲染。

设置为 false 时，当前条件里包含的元素会被销毁，如果包含的是组件，则组件对应的生命周期函数（beforeDestroy，destroyed等）会执行。

设置为true时，当前条件里包含的元素会被重建，如果包含的是组件，则组件对应的生命周期函数（created，mounted等），计算属性，watch等会执行，相当于重新渲染。

3.vm.$forceUpdate()

强制更新视图，仅仅是刷新视图，实例对应的生命周期函数，计算属性，watch等不会重新执行。

主要是针对数组更新不刷新视图问题

    this.$forceUpdate() // 调用这个方法会刷新视图

在less里面计算宽高

    //css中
    height:calc(100% - 30px)
    //less中
    height:~"calc(100%-30px)"

常用Git指令

    1、用户配置(初始化：分别设置提交代码的用户名和电子邮件地址)
        git config --global user.name "xxx"
        git config --global user.email "xxx@com.cn"
    2、创建一个新的代码库
        git init [repository name]
    3、克隆(用于第一次拉远程代码)
        git clone [url]
    4、添加(将文件添加到暂存区)
        git add *   //添加所有文件
        git add [file name]  //添加指定文件
    5、提交
        git commit -m [提交时的备注] //提交git add命令添加的所有文件
        git commit -a  //提交git add命令添加的所有文件，并提交git add命令之后更改的所有文件
    6、显示差异
        git diff //显示尚未添加到暂存区的文件的变更
        git diff –staged  //显示添加到暂存区的文件与当前最新版本之间的差异
        git diff [one branch] [another branch] //比较两分支之间的差异
    7、撤回
        git reset [file] //撤回暂存区的指定文件，可以保留原有改动
        git reset [commit]  //撤销指定提交，本地可保留变更
        git reset –hard [commit]  //将丢弃所有的历史记录，并回滚到指定的提交，慎用慎用
    8、状态
        git status //显示所有需要提交的文件
    9、移除
        git rm [file] //移除指定文件，并将该操作提交到暂存区
    10、日志
        git log //显示当前分支的版本历史记录
        git log –follow[file] //显示某个文件的版本历史记录，包括文件的重命名
    11、显示
        git show [commit] //显示指定提交的元数据以及内容变更
    12、分支
        git branch //显示当前代码库中所有的本地分支
        git branch [branch name] //新建一个分支
        git branch -d [branch name]  //删除指定的分支
    13、切换分支
        git checkout [branch name] 
    14、合并
        git merge [branch name]  //将指定分支的历史记录合并到当前分支
    15、推送 
        git push //将本地历史推送到远程
    16、更新
        git pull //从远程拉取代码
    17、获取远端库分支的更新情况
        git remote update origin --p

常用linux指令

    rm [file name]  //删除指定文件
    rm -rf *  //强制删除所有当前目录下的文件
    ll  //竖向输出当前目录的所有文件
    ls  //横向输出当前目录下的所有文件
    pwd //显示路径
    cd [route name] //切换到某路径
    mv [route + filename] .  //在指定位置复制文件到该路径(小数点可不能少呀)
    unzip [file name]  //解压制定压缩文件

常用终端指令

    npm cache clear --force  // 清除缓存
    start-process PowerShell -verb runas //利用管理员身份运行
    Set-ExecutionPolicy RemoteSigned -Scope CurrentUser -Force //开启运行脚本的权限

个人整理，实属不易，望君珍惜！

前端----随笔录（二）