好,首先我们要达到这样的效果,是吧?这里还有个边界啊,背景颜色是不是啊?比如说背景颜色我们怎么设?其实我们在展示自己的作品的时候呢,我们可以右键来检查的,是不是好检查的时候呢?元素这里 点中啊,比如我想要这里颜色,我要改,我检查,我要点这里颜色要改,我点查这里,他们这里有自动变化,是不是?好,这时候我要调这个颜色 啊,我就在这个颜色上面点右键检查,他这里会自动锁定这个标签,然后这个标签在这边右边呢,就会看样式 啊,样式还有大小,假如我姑姑大啊,我放大一点,比如这里八百,我就再点进去 改了一下,是不是好像你就变这样子?九百,哎,太宽了,是不是?我就可以直接在这里上面修改,直接看到这样子好,然后这里觉得,哎,太宽了,一千太宽了,我九百啊,虽然九百 还有位置,是不是?那我就可以调了,到底调多少啊?今晚饿不行了,是不是啊?我就看的很清楚吗?然后呢?这里颜色呢? 好,在这里就可以去改变他,是不是啊?改的住呢?我们在这个地方啊,点这个原颜色的图标啊,在这里设,是不是啊?然后改一种颜色啊,你就在这拖动,当你可以其他颜色,你可以这样拖动 啊,点这个小图标啊,在这里拖动,是不是啊?看到上面没有,但如果说白色,那就可以调动,是吧?还是灰色,是不是啊?这样拖动好,拖动完之后我怎么存起来呢?这里是我把这个数字牵起来, 把这个啊制服串啊复制,看到这个的标签没有打开我的,打开我的这里的标签,是不是看到没有这个 ing 一是吧打开,然后就回到这里来,就这个标签, 然后在上面样式代码里面,这里我就可以把这个数字把它换过来啊,注意不要多了,是不是转换过来保存好,然后继续刷新一下,是不是那尺寸改了没有? 还没改是吧?啊?九百二,我又去去了,刚才你这里改为九百二,保存好,然后进行刷新啊,他就变正,我们看到了,看没有这里好,这时候呢,我们要集中是不是或者是中间距离?那其实就图片问题了 啊,这两个是肿的,这个是其中一个,是不是啊?我们再去射他的大小啊,就可以达到这种效果啊。所以呢,我们这里啊,主要一个 这里的应用,还有这里应用就用的是什么检查元素的啊?右击检查元素啊,元素和样式的应用是在调试网页。
粉丝781获赞3666

哈喽,大家好,大家看这样一个效果,在点击这个元素时候,他会变成这样,由这 他又会变成这样,我们管这种效果叫元素共享效果,我们这里呢也写了一个比较简单的,大家看 相当于同一个元素变化的位置,处于一种共享的状态。那具体的实施思路是怎么样的呢?首先我们分析一下这原先他的这个在这里的元素,他的布局是相对布局, 他要变成这样的话,这里子是绝对布局,因为他是垂直水平居中吗?相对于这个适口相对布局变成绝对布局,他可以直接实施这种动画效果吗?好像不行,对不对?那有没有什么见解的方法呢?其实我们可以先 先把相对布局改成绝对布局,再把绝对布局的 left 跟 top 值设置一下就可以了,因为绝对布局和绝对布局之间的 left 跟 top 值互相改变的话,他是可以做到动画效果的。但是现在会遇到这么样一个问题, 把这个代码注视一下,大家看啊,现在是相对布局,点击之后,大家发现没有,他会从左上角变成垂直水平居中的效果。 因为我们一开始把 fix 的布局设置成 left 零, top 零了,所以相当于 只要你把这个相对布局变成绝对布局的时候,绝对布局就会从左上角直接变换成百分之五十。百分之五十的效果显然不符合我们的预期,对不对?所以我们可以 采用一种方案,就是当你准备要从相对布局改变成绝对布局的时候,可以获取现在相对布局元素的 top 纸和 left 纸。 举个例子啊,当你在点击这个元素的时候,你可以获取它的 top 值跟 left 值, 比如说啊,这里是五十,这里是四百五十像素,那么我们需要做的是先把这个 relative 改变成 fixed, 对不对?同时我们要把这个 left 和 top 从五十,哦不对,四百五五十 变成百分之五十,百分之五十,对不对?我们要把这个 left 值跟 top 值给他设定好,要不然他就会从左上角直接变换那个显然就不符合我们的效果。那有了这个速度,我们就可以把这个主食给他解开,那我这里只是简单的实现了这样一个效果。 只是一张图片啊。其他的呢?大家可以自行尝试一下,下期再见。

还是有一些非常非常小的隐患,这种隐患呢,我希望大家永远不要遇到,遇到了之后呢就有点麻烦了。你看现在是不是效果,各种效果都完成了,无刷新跳转完成了,根据不同的页面渲染不同的组件完成了,其实也并不复杂啊。 好了,还有什么事呢?加个东西叫命名路由,这个啥意思呢?其实目前呢还是有一些非常非常小的隐患,这种隐患呢,我希希望大家永远不要遇到,遇到了之后呢就有点麻烦了。什么隐患呢?是这样子, 写来写去,写来一去,因为都快写完了,有很多的抄链接。突然有一天啊,你的万二的项目经理,万二的产品经理就跑过来了,哎,小伙,哎,咱们想把这个文章页面啊,这个 vlog 啊,给他改一下,改成什么呢?改成阿铁口, 你看你要不要崩溃。那你就改呗,我们就跑到这个哪里去哪里去改,改到这个吗?配路由配置这里是吧?把这个路由配置从 vlog 变成 article, 这样你改了过后,你会发现链接全部不能用了,首页没问题,文章匹配不到了,对吧?是不是匹配不到这个主见了? 关于我这都没问题,就这个东西匹配不到了。那如果说你在页面上到处是抄链接,到处都要跳到文章页面改的链接地址是不是很多,你还跑到主线里面到处去改,但这个是个小问题啊,也有的时候呢,如果说发生了,他就不是小问题了,没有发生就是小问题。那怎么解?能不能解决呢?可以解决的,可以解决的。你看啊,我们改动了这个路径含义变没变? 含义不能变吧?你含义变了就是需求都变了,那需求变了肯定要说你在改改贷吗?这是毫无疑问的。没办法,那含义一般是不会变的啊,他只是路径变了,这含义还是博客。 因此呢,怎么办呢?怎么来解决这个问题呢?我们叫做命名路由。什么叫命名路由?我给每一个路由啊取个名字,比方第个路由的名字就叫哄啊,管理路由是啥随便你路由 是啥无所谓,反正你就叫了个名字。你名字不能变,因为名字表表示是含义,含义不能变对吧。路径随便变,我们先给它变成 vlog 吧。 好,那么接下来呢,我们在跳转的时候啊,我这里该给每个路由取个名字,然后跳转的时候呢,就不是直接像之前那样子啊,写个 two 然后呢?写个什么啊?负是吧,这样子就是平直接写路径了。你不要写路径了, 你该写对象啊。写对象的话是不是必须要用动态绑定对吧。你不要写 gs 代码才能写对象,写对象对象里边用 name 首先来表示我要跳转的路由名字,那他就会从从那个路由配置里面去找。哎,你跳转的名字是负哎,找到这个了哦,他的路径是这个名词呢,他会自动的把这个路径放到这来。 明白明白的意思吧。这样子呢,是不是就解除了跟路径之间的偶合了。那你只需要关注名字就行了。因此呢我这边把这改一下啊,我这里不用宁可这个名字了啊,你这个属性了啊,那换一个 嘞。我们这里呢用哄 message 对吧。我们这里只不过是循环绑定而已,其实就是把这个东西名字呢放到 to 这里,而 to 是什么呢? to 是一个对象,对象里边 name 的属性给它复制为 itune 的嘞,对吧?只不过一个循环动态绑定而已, 那么他就会根据名不同的名字去找到对应的路径生成。好,你看没问题对吧?你看,没问题。好,接下来一看,神奇的事情发生了,我现在呢,去改动这个 vlog, 改动的路径 r t 口现在有没有问题?现在不会有问题了。为什么?因为我们这边关联的是名字,不是路径的,是不是解除了跟路径之间的偶合啊,那么他会根据名字动态的去修改他的路径。你看啊,首页现在文章自动就变成 r t 口了, 看到没,是不是很舒服?这样子啊,这叫命名路由,并不复杂吧。关注多余简介号的同 学打断一下,我是袁老师,你能跟着我卷到这里,那我就再送你一个能卷死所有人卷的五体投地的课程。这套课就是我录制的大师课,里边包含原理、原码,思想,还有笔面试题, 这些都是求职提薪、跳槽绕不过去的内容。并且呢,我毫不夸张的说,论这些内容的价值,如果说一份工作年薪三十万,那么大时刻这几天讲的东西可能在你的面试中就能值十万。 单说他里边涉及到的面试题,只要你面试的时候遇到了,这是大概率事件,你把我给你的答案不用百分之百,能够说个百分之六七十,对面试官的杀伤力都是核弹级别的。不管他曾经面试过多少人,这种场面他没见过,我一点不跟你开玩笑。 当然呢,我也欢迎各大公司的主管面试官前来参考借鉴,同时呢,也送给各位同学拿去学习提升。怎么领取评论区第一条,进粉丝群,然后根据提示领取就可以了。

下面这个问题,导航里边我单独说一个东西,叫做激活状态,这啥意思呢?就是我们搞定这个选中效果, 其实这个选中效果啊,导航就通过个 rotor 宁可生成的 a 元素啊,他已经给你考虑到这个问题了,因为我们导航里边有些当前到底是什么页面还要给选中,对吧?他怎么考虑的呢?他会用当前路径。什么叫当前路径?如果你是哈西,这就是当前路径。如果你是不是哈西,你是这个玩意啊? history api, 那么这个玩意就当前路径。 总之呢,他会根据模式来者得到当前路径,对吧?他会把当前路径和什么呢?和你的导航路径进行匹配。什么叫导航路径? 这种?这种就叫导航路径,由头领口的 two 跟每一个 a 元素进行匹配,比方 blog 跟这个什么斜杠进行匹配,然后呢? blog 跟什么 blog 进行匹配好,然后他会在合适的地方给你加上一些内样式,这内样式他到底什么效果?他没有写,你是 自己去写,然后把那样式的名字给你加上,看着啊,他怎么弄的?如果当前路径以导航路径开头的算作匹配, 那么他会加上这个的样式。如果当前路径完全等于导航路径,得算做精确匹配,他可以加上这个的样式。比方说我们访问的路径是 blog, 比方说我们访问这个路径就当前路径吧,那么他就会跟这个,他就会把这个路径拿去跟这些导航链接进行匹配。怎么匹配呢?如果说你的导航路径是这个,你看首页是不是这个, 有没有匹配?有匹配的哦,因为当前路径是以这个路径开头的,你看是不是也斜杠开头嘛,至少有个斜杠嘛, 那么这个东西就算匹配,他会给你加上这个的样式,你看一下我们的首页,是不是加上这个的样式叫做 rotar link x 啊?后面这个是我们自己加的啊。看前面这个啊,你看啊,第一个 a 元素是不是跟当前路径 vlog 进行匹配,它是以它开头,因此呢,匹配 好第二个 a 元素啊,你看 vlog, 它不,这个路径不仅以它开头,而且两个相等,因此它可以加两个样式,一个是我们刚才看到的 rotor link active 匹配的样式,还给你加了一个精确匹配的样式。呃,那样那样式啊,叫 rotor link exact, 精确的选中的样式, 对吧?可以加两个样式啊,你看,我这里也记住了的,不仅匹配,还精确匹配好。下面这个呢?呃, box 呢? 这个,这个玩意,这个路径是以他开头吗?不是那么一点关系都没有,当然更加不可能相等,对吧?一点关系都没有,所以说没有的样式,下一个呢?一样,下一个,一样,没有的样式,他就默认用这种方式来做的,哎,用这种方式来做,我们能不能写出来这个效果呢? 感觉上好像是可以的,对吧?我们给哪个的样式设置样式啊?有人说,哎,我应该给他设置样式,对不对?哎,但是呢, 你会发现他呢,有可能有两个元素都有这个样式啊,也,他也他开头,他,因为他不是精确匹配嘛,他只是匹配,对吧?因此呢,他有可能匹配,他也有可能匹配,所以有两个 a 元素都可以选中,那能不能用精确匹配来设置个那样式呢?用这个那样式来设置这个效果呢?可以啊,我们来试一下吧。 我们在这里啊, menu 这里。呃,找到下面我们之前的事实吗?是 negative 的,对吧?我们这里改成这个,改成它这里写的这个 rotar, ink, exact, egg, tea, 对吧?改成这个类样式的名字。好,你看文章是不是选中了 点?首页是不是选中了点?关于我是不是选中了点?项目效果是不是选中了,你看那样式啊,你自己去看那样式好像没问题啊,挺好的呀。 啊,如果说你真的是这样子的话了,如果说没问题的话,那就 ok 了,那就设置没问题。但是在我们这个项目里边实际上是有点问题的啊,因为我们其中有一个地方有点麻烦,什么地方?文章这里,文章这里有可能会出现这种情况, 他的链接可能是这个样子的。比方说看一下啊,我们到找到文章的一个分类,某一个分类,你看他链接变了,变成这个样子,因为在文章这里可能有很多个不同的页面都他都是要选中他的, 懂我的意思吧?也就说我现在要比方说做了要做的是什么?这个东西访问这个地址,这个 a 元素还是要选中,但这个 a 元素能选中吗?选不动了。为什么呢?因为现在这个 a 元素他不是精确匹配了,这是我们的当前路径,他只是以他开头加上那个 rotling x, 但是我们要做的是不是他还是要选中, 那说明啥呀?说明我们肯定肯定是不能用他了,但是用他也不对呀,对不对?是不是用他也不对啊?因为用他的话,有可能把他又影响到了,对吧?他也有可能,因为他也是以他也写给以前刚开头的,对不对?哎,是不是就出现了一个矛盾啊?用他的话,一看两个都选中了,对吧?肯定是不对的。 那怎么办呢?你看啊,现在就接下来就可以改动了,他是支持改动的这个匹配规则。 rotar link 啊,这个导航啊,他有一个不耳属性的一个寨子。什么意思?精确的。啥意思呢?如果说你添加这个不耳属性了,那么他就会把匹配规则就之前这个匹配规则改了,只有精确匹配,他才会有这个的样式。 好比方说,看一下例子啊,当前访问路径是 blog 首页,我是精确的,那么不好意思,现在没有的样式了, 因为他一旦变成精确匹配的话,他必须要他和他相同,才会有这个类样式,不是精确匹配的, ok, 那么他就有两个类样式,跟之前一样,对吧?而 boss 是精确匹配的,那没有这两个,这个东西也没有啊。那么再比如 blog d t l 一二三,比方这个访问路线 好,我们的导航,这是我们导航,首页导航,他精确匹配,那肯定是什么路,什么内名都没有。那如果说他不是精确匹配,是不是至少有个这个东西 以它开头吗?于是呢,我们把它改成一个,再看一下啊,看一下这个 a 元数,是不是现在什么样式都没有了,没有一个精确匹配的。看下首页,只有精确匹配的时候,它才会加上加上这个样式啊。前面这个样式我就不用了,就用这个 rotarind att, 因为它也是只有精确匹配的时候才会有, 对不对?哎,是不是就相当于是我们之前写 menu 的时候写过了这个东西啊?是啊,就这个东西,一个 sex 对不对?那么现在把这个属性名字换一下啊,一个 sex 是不是要精确匹配? 激活状态是否要精确匹配好?那么这里这边文章呢?是 boss 不需要精确匹配,因为文章里面还有很多的东西都要匹配到文章,只要以文章开头就行了啊,首页必须要精确匹配。关于我必须要精确匹配,这个必须要精确匹配,这个玩意必须要精确匹配,因为他们都只有一个页面。好,那么这个没设置不要 啊,没有必要要了,因为现在有一个 root link 啦,它会自动绑我们家的钥匙。好,回过来,你看,这是我们的数据,那么我只需要把这个 excite 绑定到哪儿? 绑定到 it, 点一个 reaction。 首先我们看首页精确匹配了,是不是应该有他就有这个样式,只看这个样式啊?然后点文章精确匹配了,是不是有这个样式?但是文章这一块呢,我不要求他精确匹配,因此呢,我们访问这样的地址, 访问这样地址是不是也有这个样式,你看文章对不对?而关于我是精确匹配的,因此呢,必须要跳到这才有才有这个东西项目效果。哎,你看现在是不是符合要求了?我们是不是要只要设置这个样式就行了,对不对?而这个样式是不是我们已经设置了?刚才已经设置了啊,你看我点文章没问题吧?这东西都没问题。然后我们访问刚才刚才的文章下边的地址啊, 你看他是不是也是选中的,对吧,就挺好了。哎,我们就把这个激活状态就是选中效果锁好了,好就梳理一下啊, 关注都一剪辑号的同学打断一下啊,我是袁老师,总听我讲短视频,这回呢,来听听我讲的大课。我给大伙呢专门录制了一套大吃课,现在呢,免费送给你们, 不管你手上现在看的是什么样的资料,都应该先停下来,先来看一看我这套大师课。一方面呢,这套课程里边的内容都是前端最核心的知识,其他的知识都是在这个基础上生长出来的,你先掌握好了这个再学啥都事半功倍。 而且呢,自此以后,你对前端技术的理解不会存在任何的障碍。另一方面呢,这套课还能够提升你的眼光,让你具备分辨好坏的能力。 看过大师课之后啊,有一些不入流的资料,课程博客论坛你就看不上眼了,这种能分辨好坏的能力也能够为你将来的学习省下不少的时间。 所以呢,还没有领到课程的同学,赶快抓住免费领取的机会,进评论区第一条,加入粉丝群,然后根据提示领取就可以了。 那有些人有些朋友说,那这个内样是名字太长了,我不喜欢这个内样式。那我能不能换成是 liket 的呢?可以,他可以改的啊,也是通过这个主线的两个属性改,一个是改 active plus。 这个属性改的是什么呢?改的是这个。 呃,改的是这个类样式的名字啊,改的是他的名字,还有一个呢,是改这个哎, exact active class 改的是什么呢?改的是这个类样式的名字啊,这个类样式的名字呢?我倒是用都不用改一下吧。把这个 active 的样式啊, active class 的样的名字改成什么呢?改成 selective 好,那么这里呢,改成 selective selected 啊,改成自己的那样式好。然后呢,把这个 exact 呢给它设为空啊,不要这个样式了,这样式对我来说没用, 这里空好保存啊。我们来看一下,效果是一样的,你看我们现在 a 元素, 你看 class 是不是挺好的,对不对? ok, 这就是我们目前的啊,这个地方的做。

这一节课讲一下在无忧中啊如何操作盗墓元素。官方不推荐使用原生 gsr 来操作盗墓元素,但是一个项目中啊,或多或少是需要操作盗墓元素的,无忧肯定也是提供了解决方法。这节课就看一下在无忧中啊如何操作盗墓元素。 打开控制台,先打印无为 m 实力对象, 啃速点 log 打印的是 vm 十一对象属性中有一个 到了啊,一言烦死当前的属性值啊,为一个空的对象操作动物园 就是用到刀软 r e f s 属性返回 vs 库的。在试图层上添加 h 一标签, 给 h 一标签添加文本,再添加一个按钮,要实现点击按钮获取 h 一的文本内容。 使用原声 gs 非常简单,给 h 一添加 id 属性就可以实现。通过 document 点 get island get element 白 id 啊,可以获取到 he 盗墓元素。我们也可以给 he 标签添加 r e f 属。 不使用原声的 gs 方法,属性值是不定义的,例如就叫 h 一 tax, ctrl f 保存代码,重新打印一下 vm 实力对象, 还是看到了 r e f s。 注意,此时到了 r e f s 就不是一个空的对象了,它里面有 h e t x。 当鼠标移动到 h e t x, 其实会发现选中的就是 h 一盗墓元素。 好给按钮啊添加,点击事件, 点击按钮,要获取 h 一的文本啦, nice 中定义 btn 方法,直接来打印一下文本叫 consue。 点 log 怎样来获取动物元素啊?有了,到了 r e f s 这个属相就非常简单了,直接这是点到了 r e f s 点。点什么呢?我们自己起的名字叫 h e tax 叫 h e t x 啊,当前拿到的就是 h e 盗墓元素,那要获取文本,直接使用 inner t x 就可以拿到文本, ctrl s 保存代码,注意看,点击按钮,拿到了 h 一的文本。 r e f 手相不仅可以操作盗墓元素啊,还可以操作组件中的数据和方法。 定义组建定一个买卡姆伊,组建 好就一行代码,我们就不抽离模板了。 h 一,那这个是 来看不一主见 在组建中啊,定义 date 数据和 max 方法 好,对特里面 这套里面就定位一个 mac 纸吧, 随便来点内容啊。同样带来一个方法, 定义瘦方法 就要用瘦方法,那我就打印一二三,简单一点啊, 在 ctrl next 下面注册组建,此时带试图层就可以使用组建了。 ctrls 保存代码,先看看组建有没有加载进来。买卡姆伊组建没有问题啊, 我们要做的就是使用 r e f 属性,直接在副组建中获取 mac 组建的数据和方法。数据指的是 dt 里面的数据,那方法指的是 mac 中的方法。 给买卡姆伊啊,添加 r e f, 好,给他起一个名字,也叫买卡姆伊。 保存电板之后,再控制台里面再次打印一下 vm 实力看速点 logo 看一下。到了 r e f s, 现在里面除了有 h 一 tax, 还有一个买卡姆伊啊, 那点击按钮, 点击必添方法,看看能不能拿到赌界里面的数据啊。直接打印啃瘦点 logo, 这是点到了 r e f s 点好,这一次就不是 h e 了,我们起的名字叫 mac come in, 然后再来点 message, 因为数组里面他是有 ms 数据的,那我就直接点 ms, 点击按钮好,打印出 hallow, 打印出 halloweew, hallow 是 h 一的文本,而这里的 hallowe 又是组建里面的买喜纸,说明可以直接获取组建里面的数据。那能不能就用方法也是尝试一下啊。 face 点到了 i e f s 点买卡姆伊,先获取到赌件,然后直接掉用方法。赌件里面有售方法,直接进行掉用, 点击按钮看一下能不能调用瘦方法打印了一二三没有问题啊,那我们的瘦方法就是一二打印一二三。 这就是使用 ref 属相来获取动物元素啊。和组建这节课我们就讲到这里啊。

很多同学写代码的时候,条件判断全用 vif, 根本不管 vio, 你 是不是也有这种习惯,觉得反正效果都一样,都是让元素消失,用哪个无所谓,这就大错特错了。虽然视觉效果是一样的,但在底层原理和性能开销上,它们有天壤之别。我们首先从原理上做下对比, 我们到底干了什么?首先是 vif, 它经过 b 的 编辑器之后呢,会得到大概这样的一段代码。从这里可以看出来, vif 它是真正的条件渲染,如果条件为假,它会直接创建一个注视节点站位。像这样子,实际上段木树里面是根本没有这个 d i v 的, 只有当它为真的时候呢, 会去创建这个 d i v。 那 微嗅跟它有什么差异呢?比如说这样子的一个微嗅的代码,它经过 vivo 编辑器之后呢,大概会得到这样一段代码,并且这里不管条件是真还是假, create element 都会执行。也就是说,当我们节点永远会存在, vivo 只是通过指令的方式控制它的 css display 属性。为了更好的对比呢, 接下来我们来从性能的角度来对比一下它们的差异。这两段代码我们分别使用 vif 和 vshow 来控制,里面的内容都一样,都是通过 vfor 的 方式渲染三千个 d i v, 然后设置到两个按钮去切换 vif 和 vshow 的 显示和隐藏。这两个按钮中的逻辑都差不多,重点是我们中间使用 await next tick 去等待到我们更新完成, 然后在前后呢,分别使用 await next tick 去获取到前后的一个时间,那最终我们就能得到它的一个渲染时间,然后 vshow 的 方式也是一样的, 接下来我们从 u y 上来看一下效果。首先点击切换 vif, 可以 看到通过 vif 的 方式渲染了三千个, diy 花了十七点六毫秒。接下来我们看一下切换 vif, 可以 看到通过 vif 只花了九点七毫秒,差一点就在于 vif 每次切换的时候呢,都需要销毁动并且重建动,而 vif 呢,只需要改个样式,瞬间就能完成。那什么时候使用 vif, 什么时候使用微秀呢?第一种场景是频繁切换显示状态的时候呢,最好使用微秀,比如 types 切换弹窗显示手缝型菜单。第二种是如果条件很少改变的时候呢,比较适合使用 vif, 典型的比如用户权限的判断,手屏数据的加载等等。第三种是需要组建销毁生命周期的时候呢,也最好使用 vif, 因为 vif 它不会触发 errant 的, 就比如说关闭弹窗的时候需要重置表单,这个场景不同的用法性能也是不一样的。现在你会使用 vif 和 vif 了吗?