vue怎么实现审批功能

工作当中咱们会用到做这种流程图的一页，嗯，相对来说是一个比较难的点，有没有好用的一些地上方的库供我们谁实用呢？这个是我实现了一个，如果你需要用的话，可以参考我这个，这个其实非常好用的一个做工作流，做流程图主要是依赖于这两个， 这个是他的一个官方的文档，就是他，然后他有 bpm 的这种风格，还有这种审批流的这种风格，尤其有的时候你做这种请假这种流程，可能是需要用到这样的， 包括还可以制定咱们的场景，包括咱们常见的如果画一些这种工具图，也可以用它来画，怎么样使用， 说的也非常详细，那么用 apm 的方式直接引入这两个库就可以了，咱们用的时候还要引入他的一个 cs 文件，就这两个，那逻辑其实很简单，他有节点，有编，还可以监听他的主题，还可以设置背景颜色，还可以拖阵 a， 支持一些第三方的这种差劲，还可以 分储物，他的数据结构对后段同学也特别友好，都是宿主里面包的对象。如果你工作当中有这种类似的业务，工作流、审批流的业务，这个插件是非常不错的，建议大家使用。

快去认证成为 view 官方认可的 view 开发者吧！最近， view 正式推出 view 框架能力认证证书，该认证由 view 时购与 view 团队合作提供支持认证的考试提及由 view 的创建者，由于稀审核， 并且该计划的一部分收入将用于支持 vivo 的开发。那获得 vivo 认证有哪些好处呢？好处一，展示您的 vivo 能力 获得密欧认证表明你已经具备了使用又构建复杂应用所需的知识和技能。这种水平的专业知识对存在的雇主或客户很有吸引力，因为他表明你致力于了解最新技术以及提供高质量专业水平工作的能力。好处二，增加就业机会 vivo 是一个流行的前端框架，许多公司都在寻找熟练的 vivo 开发人员。获得 vivo 认证可以帮助你从其他候选人中脱颖而出，并使你成为更有吸引力的职位空缺候选人。那如何进行认证呢？首先，你可以先去查看 考试准备指南，已确保熟悉考试要求。如果需要额外的培训，也可以参加额外的强化训练营。考试的话都是在线进行的，其中包括多项选择题、编码练习题。实认证共分为两种，普通又开发认证，还高级又开发认证定价及对应的服务。大家感兴趣的话可以去官网查看。 分享到这里就结束了，希望对你有所帮助，我们下期再见，关注我，了解更多互联网资讯！

面试当中我们的一个管理系统要做权限管理应该怎么做？那么前端的权限可以分为接口的权限、按钮的权限、菜单的权限、路由的权限。那么咱们今天就带大家去看一下到底菜单的权限怎么做。一般的菜单的权限 其实有两种方法，第一种是可以前端控制，再一个就是后端控制，不过就在实际的应用当中，最好是前端来进行控制，不然的话你加一个拆台箱，还要和后端说，就类似，这样太麻烦了。那么具体怎么样做呢？ 这是我们的一个唯一的一个管理系统，那么主要是在这几个文件当中，一个是 mate gs 里面， mate gs 里面是我整个项目的入口文件，再一个呢是我这个路由文件，这个路由，那这地方是要分什么？我的基础路由就是这个地方，这是基础路由 啥呢？也就是说这些路由不需要任何权限都可以访问，比如登录的这个页面，四零三四零四五百的页面，那还有一个是需要加钱用的路由，也就说我这里边统称为 e 本路由，也就是说页面当中的像这样的首页图表模块，包括还有一些组件 签到了，组建其他的一些页面。这地方有一个点需要注意的是，我的每一个路由就需要动态加载路由的地方，我需要给每一个路由指定 唯一的一个 id， 这个 id 我在这里，我定在这个 mate 里面，也就是说所谓的他的角色啊，他的角色，每一个路由他都对应对应一个，这个类似于入这个唯一的一个 id， 这里我需要用到 voe 的一个购置函数， 这个他有三个参数，一个是我要跳转的路由信息，当前的路由信息，那个车叫直行的路由信息。首先这个地方我要获取 根据当前登录用户登录进来之后他的角色，那么登录进来之后可以看一下，他会返回当前登录用户他所在的角色，这个 urd 就代表了什么？这个用户有哪些材料权限？ 那么在这地方我获取到之后，那么我需要去获取所有的他的这个路由，那么获取完他的路由之后，最终我用六一提供了这个 a p i 哎，然后放到这个路由里面，我给他注册进去，那么这地方我要判断一下是不是登录了，如果没登录，那我就跳了登录页，这地方是否生成了路由菜单，如果是有的话就直接跳走了， 那么这地方还要有一个判断是啥呢？如果他是从登录页跳转过来的，那么我会，我们会默认取这个菜单当中的默认的第一个，那么我就会跳到第一个这个页面里面，再看这个文件 里面的这个获取所有的这个路由，这个入是当前登录用户他所有的角色啊，根据他获取当前登录用户他所有的路由啊，这地方用到一个这个方法，这个方法其实就是低规嘛，低规去便利生成你所拥有的路由， 这个地方是判断就是返回过来这个 red 啊，是不是包含在这里面，如果包含的话，那就直接放到里面认证，登录完进进之后，他打印的最终的路由，默认的话就是影影带什么，还有他这里面所有的路由都有，因为我是用这个管理员，系统管理员登录，我也可以不用系统管理员， 我也可以用其他角色，看我还有什么角色。我还有一个普通用户，你可以看一下，普通用户他只有这三个菜圈，首页还有这个，还有这个，对吧？那么我可以用普通用户登录，那么普通用户他是哪个账号呢？他就泰式账号可以看一下，我退出一下，我用泰式登录只看到 三个菜单，不管是在面试当中，或者说在做类似的功能，完全可以拿过去，我的这个代码可以照搬过去，作为你们的一个参考。管理系统当中路由权的控制，如果你们有更好的方案，欢迎评论区留言。

假如说咱现在要做一个系统，做一个什么样的系统呢？比如说这里有一个登录啊，啊，输入用户名密码，一点登录，然后就会跳转到一个系统里面了，这就一个系统啊，然后这个系统大家可以看到啊，他这个啊上面呢有一些菜单，用画图给他打开，大家看啊， 这管理系统进来之后，上面呢他会有一些菜单啊，比如说这个，呃，资料审核呀，发票啊等等等等之类的啊。然后左侧呢也有一些菜单，然后右侧的主体内容呢，是一个 呃显示正常系统功能的一个页面啊，那点击这些列表或者翻页的话，都都能实现一个跳转啊，那咱们如果说想实现一个这种系统的话，肯定是需要这种 页面跳转的功能了，但是咱之前讲的那个 vivo 呢，单文件组件的 vivo 呢？他只有一个页面，对吧？不能随便跳转呢？那今天呢咱们讲什么？讲这个 vivoutut 就可以实现 vivo 应用 页面跳转了啊？那比如他怎么用？咱们从头开始新建一个项目再说啊，那我这里先打开一个今天的内容，八月三号啊，那首先呢，我在这打开一个密码工具， 打开面条工具啊，那咱们现在要做什么呢？要创建一个 vipo 项目，对吧？那咱上一次讲了，讲了 npm， 然后 innite， 然后是 vt， 用 vt 创建一个应用 vt， 那这个呢，就叫如车下划线呆萌回车，用 vt 创建一个如特呆萌的一个 vivo 的箱， 那这个创建创建速度应该还是挺快的吧，咱看一下效果啊，呃，应该是建完了，对吧？建完了，然后我用 wifi 之后把这个项目打开，把这个新建的项目给他打开， 在这个 oppost love you 八月三号啊这个项目， 那好，这项目建完之后啊目结构大家应该很熟悉吧？ sr c 咱主要的组件都写到这里了，对吧？这还有个拍开点这身，他依赖什么呢？啊？依赖这个 beau， 我需要把这个 beau 给他下下来啊，然后，呃，他这里还有个 beat 工具，对吧？这就是 beat 啊，然后我现在如果想下这个 beau 的话，需要 cd 先进到这个卢特呆萌里面啊，然后 c n p m 因斯道安装依赖，安装完依赖之后我们就可以启动这个项目啊。 好，那他下完了，下完了，然后我们启动这个项目 npm rend 第一位，这个呢，就是用 b 启动一个 项目，启动完成之后咱们应该就可以在这个呃三千端口里面访问这个项目了， 他还在还在启动，是吧？哎，启动好了啊，默认的话，咱创建一个默认的六三项目的话，他是有一个计数器，对吧？计数器啊，当然这个功能咱不要啊，咱要的是什么功能啊？咱要的是一个刚才说的这个啊，对吧？一个这种系统，对吧？可以实现页面跳转呢？可以可以，有登录啊，这个登录功能啊，当然 咱们把这个系统给他简化一下。简化到什么程度呢？把样式都给他去掉，大家懂吗？现在这个系统是一个呃 登录然后跳转到系统里面呢，是这样可以实现一个内容管理啊，菜单啊，可以切换呢，可以实现一个这个功能。那咱们把这些样式全都给他去掉啊，咱就给他搞一个最简单的一个。 呃，最简单的一个效果什么样呢？咱就实现一个这个效果。大家看啊，现在是用户名，比如说我用户名输个一二三，密码输个一二三点登录啊，他是用户名或密码错误提示了啊，那如果说我输正确的呢？他的命啊，然后密码是一二三四五六，点击之后就可以进到系统里面了， 你再看啊，是不是上面有一排菜单，然后这有一个内容列表，然后点击列表的时候可以切换到不同的页面。切换到不同的页面啊，然后点击注销的话，还可以进到登录页，咱实现一个这个功能，懂吗？ 那那把这个功能实现之后，咱如果说会一些样式啊，加一些效果的话，就可以实现刚才那种系统的功能了啊，这看完之后，咱现在啊需要下载 vivoutut 啊，为什么下载 vivoutut 呢？因为咱创建这个项目什么没有啊？就只有一个 vivo 这个项目就只有一个标。那咱需要实现页面跳转的话，需要需要下载一个 vivoutut。 怎么下载 vivoutut 呢？咱们再打开命令长工具啊，我们先把这个项目给他关闭，现在是启动状态啊， 完毕啊，然后呃 c n p m 因死照啊，刚刚 siri 添加一个依赖，然后下载什么呢？下载 vivo gute。 但是咱用的是 vivo 三对吧？ vivo 三的话他用的 vivo uti 版本是四版本啊，所以说我加一个艾特四，这样的话就可以下。呃 vivoutur 的一个四版本啊， 下完之后咱现在再启动这个项目，启动这个项目 npm ren。 呃，第一杯 启动那个项目啊？呃，他这个是这样的， npm 四十五也好啊， npm 第一位也好，就从哪看呢？大家看，是这啊，这里是不是拍开点这一身里是不是有 一个 surpe 的一个这个属性的吧，这个属性里面定义的第一位啊，是调用 mit 命令，那就说明我执行第一位的话他就执行 mit， 执行 vip 就是启动项目啊，那比如说，哎，有小伙伴说，哎，我就喜欢用 npm rond sorry， 那怎么办呢？咱给他改成 sorry 就好了，对吧？ npmry soro， 然后把服务器给关了 啊，那这回我再启动服务器呢， npm 四五对吧，这是可以设置的，你是第一位也好，四二五也好，咱咱想用什么用什么啊，都很方便啊。对的，启动方式可以定义啊，那现在 mm 四二五又起来了啊，然后咱还是这个三千转口啊。 好，那现在是咱们做了一些准备工作都做好了，咱们现在就要开始写这个。呃功能了，写功能的话咱先实现一个最简单的功能。什么功能呢？就是说我现在打开这个，我把这个 helloword 干掉， 这玩意没有用了啊，好了，我得给他去掉。去掉啊，实现一个什么功能呢？现在就是有一个菜单啊，这个菜单叫首页啊，首页后面有一个博客啊，然后咱看一下 首页和博客，对吧。当我点击首页的时候呢，下方他会显示首页的内容，当我点击博客的时候呢，下方会显示博客的内容， 然后我先把这个样式给他去掉再去掉啊， 那我怎么实现刚才说这个内容啊，点击首页啊，对了啊，点击首页放大点啊，点击首页显示首页内容，点击博客，显示博客的内容，那我就需要创建两个页面，创建两个组件，一个叫首页，一个叫博客，对吧？啊，那第一个呢？在康复单词里， 我先把这个 hellower 给他删掉。啊，没有用了，删掉他，然后在康复的字里，我创建一个首页，叫 home 点 book， 然后我再创建一个博客，叫 blog 点 blue。 啊，咱现在的目的是什么呢？就是实现简单的页面切换，对吧？ 实际简单的页面切换的话，我就不需要关注它里面有太多的东西了，我就直接写一个 h 一标签就好了。 h 一，这个是博客啊，然后这个首页呢？ h 一有个首页，对吧？啊， 那我如何实现页面切换呢？这个就需要 vivout 提供的一些功能了。 vivout 提供了一个什么呢？就是提供了两个标签啊，就比如正常咱如果写的话，可能写个 a 标签，对吧？ a 标签，然后这是首页，首页，然后这块 跳转到等了跳转到后米，对吧？啊，然后下面有一个 a 标签，是博客，对吧？如果是说咱们以前不用六的话，那这个跳转到 blog， 对吧？ 然后中间有个斜杠分割一下啊，他是这样的，对吧？首页博客，但是咱现在用六了，六的话，我们用 urout 提供的这个页面跳转就不用那个 a 标签了。 uroututuurututigo 的呢？叫什么标签呢？叫这个啊， utile mank， 如特令，可相当于就是这个 a 标签的意思啊，就跳转的意思啊，但是他还是有一些区别的，一会咱再说区别，那这个呢？跳转到首页，然后，哎，如特令可啊， 这个跳转到如，他另一个跳转到首页，然后呢？如如他另一个 不用那个 hr e f 的，用的是兔，用的是兔啊，兔就是跳转到哪？跳转到后面啊，然后后面呢？我夹一个竖杠，然后这边还有一个轮圈 mink， 那下面那个呢？就是跳转到博客页了，对吧？啊？然后这个是兔， 等于斜杠 blog 调整到博客页啊，那我们看一下现在的效果啊，这是不是一个首页啊？一个博客啊，对吧？啊？那下面首页和博客下面的话，就是切换页面的一个呃位置了。 那我需要用一个标签给他占位啊。用什么占位呢？用这个如天六，用如天六给他占位。也就是说我切换这个 home， 切换那个 blog 的时候，他的显示的东 你放在哪啊？显示的主件放在哪啊？放在这个如特六里面，他是一个这个思路啊。好呢，页面布局咱已经写完了，我现在点击的时候下面有切换啊，但是功能还没写呢，咱现在点击他是切换不了了，怎么点击让他能切换呢？咱们需要配置一下这个路由啊。那怎么配置路由呢？这么写啊？ 在 src 里面我直接创建一个如特点 gs 啊，因为咱们刚才是下载了这个如特 biu， 咱们还没有引进来呢，对吧？所以我现在需要引入这个。呃，引入这个如特啊，音炮的啊， 可以先控制从哪引呢？ fom fom 这个如铁 fm， 这个没有如铁啊，引进来一个什么呢？他有一个方法叫 ctrl 如铁 啊，这一个结构。结构，我可以拿到一个可瑞的 rut。 可瑞的 ut 的工作是干什么呢？就是创建一个呃，陆游的功能啊，这是可瑞的 utut 啊。好，那创建一个陆游之后，我怎么去创建陆游呢？定一个陆游叫 如此，等于用咱们引进的一个方法，可瑞特如此去创建一个陆游。创建一个陆游，然后创建完成之后呢？ cos 的写错了， sunit 啊，创建一个陆游之后呢？然后我们可以把这个陆游给他暴暴露出去啊， ex pot expotd box 啊，撸铁啊，但是这个撸铁怎么配置？我需要在这里配置。 怎么配置？咱一会再配置。我先给他暴露出去这个如天的配置呢，咱一会再写。咱现在要干什么呢？就说 我需要让 w 的这个应用把这个如特给他引进来，对吧？那咱再回到刚才的这个，呃， manel gs 入口是 gs 文件，大家看入口 gs 文件，这个是不是创建了一个 w 的应用啊？然后挂载，对吧？那我需要用这个 w 的应用来使用，刚才咱们新建的没有如帖是一个这个思路。那咱们就给他先改写一下 cost f f 等于这个 w 的应用啊，然后 apple 挂载。我现在代码没改啊，一模一样，跟刚才是跟刚才是一样，我只不过是加了一个变量 app， 对吧？啊，然后呢，我先引入刚才咱们写的那个 呃，如此 gs 文件啊，他暴露了一个叫如此的一个呃接口，然后 fom fom 哪个文件呢？如此 cs 啊，这个乳铁就是咱刚才暴露出来的这个乳铁了啊，那我拿到这个暴露出来的乳铁的话，我用 apple 点柚子方法 就可以直接使用咱们暴露出来这个 vout 了，这样的话 u 的应用就可以用这个路由了啊，那接下来呢？我们的工作就是去， 呃，去设置这个路由。设置这个路由，把这个路由设置成什么样呢？设置成，刚才咱们写这个呃，可以跳转到首页，可以跳转到博客的一个功能了啊。好，那咱们现在开始正式写设置了啊，刚才写了一堆都是引入，对吧？刚才写了一堆都是引入啊，现在写设置了。 设置的话，首先这个可谓是如题，他需要传两个参数，第一个参数什么呢？叫嘿 siri。 嘿 siri 是一个陆游的模式啊。陆游的模式，这个陆游的模式呢？ 是呃，有什么区别呢？一会咱写，一会咱再再给大家说，大家只要知道的话，大家只要知道现在我引入这个陆游的模式是一个呃哈西模式就好了啊。需要引入这个可以的 word， 这个是干什么用的？一会咱启动的时候再跟大家说啊。这个大家知道，这么写就 ok 了。然后下面有一个很重要的就是这个路子，这个才是真正的配置路由， 这个才是真正的配置陆游。那我我的目的是什么呢？我想点博客跳博客，点首页，跳首页，对吧？啊？那我怎么配置呢？首先这个 入词里面入词是一个数组啊，数组里面我可以写一个对象，对象可以写个陆游 pass 路径。路径是哪呢？跳转到首页，首页就是一个斜杠啊，首页是一个斜杠，然后， 呃，跳转到哪个组件？跳转到哪个组件呢？跳转到首页的这个组件，对吧？康不是等于 home 这个组件，但是 home 主键我得引进来才能用，对吧？所以说我叫引入 home 啊，你们 pose hom， 这个康不能吃里面的这个 home 主键， home 主键引完了之后，咱再把这个 blog 给引进来啊， 不落个引进来，不落个引进来，然后呢，我再写一个路径啊，再写个路径啊， pass， 等于我只要跳转到斜杠，不落个的话 啊，我就渲染哪个页面啊，渲染哪个组件啊？ blog 这个组件。好，那这样咱就写完了， 洗完之后，咱看一下鞋带的效果啊，路由也配置完了，路由已引入了啊，然后呢，咱看一下鞋带的效果， f 十二， 呃，然后咱现在是有了一个是首页，一个是博客页啊，然后咱现在想实现一个跳转啊， 啊，这里啊，真的是引入，引入入群，对吧？引入入群，我写个引入 app 了，不好意思啊，引入入圈， app 点右，这样引入入群啊， 引入入群，然后咱看一下，哎，这个就好了啊，入群引进来就可以切换了，然后这个首页啊，博客首页博客啊，就可以实现这个页面的来回切换了。每当我们点击这个时候，大家看上面那个路径啊， 路径现在是一个斜杠啊，警号斜杠啊，然后点博客，那就是警号斜杠 blog 啊，那他就会切换到博客的这个页了啊，就是一个这个切换的功能。

谁家前端天天做官网呀，哎，真香。你还真别说，挑战七天实现微物官网的第一天，首屏，首先当我滚动滚动条的时候，第一屏啊图片有个缩放效果，紧跟着当我滚动滚动条的时候，视频会有播放，同时啊，有一个流动山海纹会慢慢升上来，还有一个 我们走啊走啊，东方灵韵，哎，他也会升上来，再往下走，哎，我们这边呢，有几张图片呀，会慢慢的再走到我们的浏览器当中，再到下一品，有一个美学创作大师走，有一个小的视频会升上来，那升完之后呢，再走，有一个左右的效果好出来，完毕之后呢，再往下走，这有个五幺二 db 的， 那么再走再走。你同学你看这个图片的话，哎，在滚动是不是可以展开，否则可以再回去，我们先做第一瓶，当我滚动屏幕的时候呢啊，滚动滚动条第一瓶的图片呢，会有一个缩小的一个效果，同时啊，第二瓶啊 图啊会有一个放大的效果。首先呢，我在第一瓶的时候呢，已经有了一个 section 盒子，是我们啊，第几瓶的意思好大，盒子里面包含了一个 div 啊，叫做 kv content， 内容里面包含了一张图片相关的样式，我们来看一下，和前面还是一样的啊，保底我给了个五万像素高度，当我们整个做完之后，咱们 去除掉就行了。嗯，再往下走呢，有个 screen， 你看这有个 screen 的类名啊，就相对定位宽度是百分之百，高度呢是一百为一尺，就是整个屏幕的高度， 所以我的一屏就是整个屏幕的宽和屏幕的高了。好，设定好之后呢，我们有个 k v content， 绝对定位啊，然后呢，它百分之五十 left， 百分之五十定到我屏幕的最中央来显示，哎，我们这个 content 呢，也是有个百分之百， 百分之百的一个，呃，宽和高，再往下走呢？里面是不是有张图片呀？宽度是百分之百，高度百分之百，然后转成块的元素，防止图片底色有缝隙。再有一个就是 object fit， 然后 cover， 就是我在缩放的时候呢，是有图片的， 保持在最中央，和我的盒子一样大。现在我想做的是不是刀滚的屏幕，哎，是不是图片会缩小到页面中的某个位置啊？那 gs 呢？首先引入了 j sep， 还引入了 scroll trigger， 那么我们又建了一个 indust 键， gs 就是我们这个开始书写啊，那第一瓶那肯定用到，是不是我们这个滚动的插件呀？哎，是不是他 点 create 好，然后呢，给它配置一下，当我屏幕滚动到哪个地方，就可以来实现这种滚动效果呀？ 哎，是不是就第一瓶就行了，叫做 section 一啊，所以说他的吹格点他就可以来实现，那开始那就是 start， 这呢就是 top 空格， top 顶部开始就行了，然后再写上一个 and 加等于 一千好了，有了之后再和滚动条，哎，做一个绑定 scooper， 然后呢，选成一个 two 就 ok 了。好，写完之后呢，我们是不是做动画就行了？ any mission， 然后做什么动画呀？ set 点 two 就可以了。哎，是不是让我们里面这个盒子的动画就行了？这个盒子呢，叫做 k v content， 让它来缩放。它缩放完之后呢，因为图片是百分之百宽吗？所以说就跟着它一起来变化了点， 他来缩放逗号，怎么缩放呢啊，那我们可以通过 form two 来做就行了啊。好，第一个对象呢是起始啊，第二个对象呢是结束啊，起始刚开始的，他的 scale 刚开始是一就行了。好，然后当他结束完之后呢，改成一个 零点五啊，这样就实现缩放效果了。好了，那到此为止，我们是不是把我们的啊 g s 写完毕了，先来看一看什么样子了，保存一下，打开一下我们这个，当我滚动滚动条的时候，走着啊，走 走。哎，有点意思，是不是上面这个就可以初步把它搞定了呀？那第二瓶的话，也是有个大盒子叫 screen， 这个呢叫 section 二了，然后里面也有一个盒子哎，叫做 samary content， 里面呢，这次放的不是我们上面的图片了，而是一个 视频。同样道理啊，我们第二屏幕中间这个盒子也是采取的是我们这个绝对定位，我们把它调到页面中的中心的位置上去，这个视频呢，也是宽度百分之百，高度百分之百，这两个的布局啊，基本是一类似的。好了，写完之后呢，我们卡夹斯保存，来看一下我们的效果啊，这是第一屏，我往上走走走，哎，能看到了，这个盒子也就变小了。 那只不过第二个视频啊，他是直接就出来的，看一下我们原版的做法啊，你看，当我滚动的时候，第一瓶是缩小的，那第二瓶是变大的，而且什么时候出发呀，而是等着我第一瓶开始的时候，第二瓶的这个盒子就会变大，所以他的触发条件不是第二瓶，而是第一瓶。 那我们的 gs 是不是做第二瓶的一个滚动了？但是呢，我们写的时候呢，你发现他是在我第一瓶的时候出发的，所以说我可以让我第二瓶中的这个 content 呢，哎，来一个变大就行了，那怎么设 设置呢？现在我们可以看到这第二瓶呢，已经是百分之百了，他是从小变大，给上面这个正好反过来的。也说，那当我滚动到第一屏的时候呢，第一屏的图片是由大变小，而同时第二屏幕中的这个视频是不是由小到大呀？ 所以现在我们在做的时候呢，有两个动画一起来做，我们就不能直接这么来写了，看到后面才能想明白的，所以说我们应该这么写啊，我们的时间线呀，来做，哎，就是 decep 啊，然后选择里面的点 timeline 点，是不是做个时间线啊？ from two， 哎，小括号好，小括号里面写的是不是就是这个了啊？ form two， 哎，我直接把这个拿过来就行了啊。好， ctrl c 到这里面去， ctrl 加 v 拿过来。那这是我们的第一屏幕的图片，这个实现的是由大到小了，我们先写完保存，你看效果啊，来，你看，哎，是不是第一个 还是有生效的呀？第二个呢，是由小变大，所以继续往下写就行了。点 from two 什么就可以了啊，接着后面接着去写，没问题。然后呢，前面再加一个点儿列式调用点 from two， 嗯，是这个啊，是我们的 samary content， ctrl 加 c 复制一份，它呢是由小变大， 好，然后呢，把它给它拿过来好了，好，它改完之后呢，不要直接用缩放啊，缩放和原先的位置不太一样，所以说呢，我们最好是改它的宽度和高度来改变，所以我们可以这么写啊，把它的宽度冒号改成一个原来的时候呢，是百分之五 十高度呢。 it 嘛，好，改成一个呃五十呃 v h， 然后呢，当我呃结束完之后呢，是不是再让它变大就行了呀？哎，复原为原来的状态啊。好，选定之后呢，到我们这里面去 ctrl 加 v 粘过来啊，这个呢是一百百分， 这个呢改成个一百为一尺就行了，好，保存一下。走啊，你看，走啊走，哎，是不是也能放大，对吧？只不过呢，有点不别扭。你看 往走啊走啊走，看到没有啊？走了之后呢？其实啊，他是等着这个图片缩小了之后他才会放大，因为我们用的是什么 时间线？时间线是第一个动画结束完了之后才执行第二个。那我们想两个同时进行怎么写？在后面再加上一个小于号，和上面动画同时进行的。来，我们再打开，你看走，你看上面在变小的同时，我下面就在变大。哎，这样，这正好改成我们想要的大小了啊。

接着讲什么呢？讲表单。什么是表单呢？表单就是放母对吧？放母，然后我这里可以写个文本，然后这里写一个按钮啊，提交表单，咱们看一下效果。我一定想实现什么功能呢？表单的话我想实现我这里输入一个内幕啊，然后点击提交表单的时候在控制台输出一个我输入的内容啊， 比如说这里属于一个 hello 啊，那我就会弹出 hello， 想实现一个这个功能啊，但是现在大家有没有发现一个问题，就是说我写任何东西的时候，我点提交表单的时候页面会刷新对吧？如何点击提交表单的时候不让那个表单刷新呢？写个 max 的方法来实现一个提交表单的功能。提交表单的方法呢？就叫 pose， 然后呢，我现在想绑定一个事件啊，表单提交的事件是艾特斯巴密特等于什么呢？等于 pose， 然后表单提交的时候我肯收点 bug 输出 helloword， 咱就先写个哈 哈喽卧的啊，然后我们看一下效果啊，刷新点击题有有单手，大家看左侧有没有哈喽卧的点击 点击啊，现在还是刷新对吧？啊？看不到 helloword， 那这个怎么办呢？我得在这个 spammit 啊后面加一个叫事件修饰服啊，叫 prant。 他是什么意思呢？就说阻止这个表单的默认行为啊，通过这种方式的话他就不会刷新了，他默认行为是刷新对吧啊，通过一个 pro 阻止他的默认行为，不让他刷新，这样的话我们就可以看到能不能获取到这个 hellowword 了啊啊是吧， mit 写错了。 好的，咱看一下效果啊，刷新一下啊，然后点击提交的时候，哎，可以输出 helloword 啊，就是说如果说我不写这个 pro， 咱们看一下刷新不写 普瑞万他的话啊，那我们点提交的时候还是会刷新的啊，那如果加了一个普瑞万的，他会阻止事件的默认行为啊，就不会刷新了啊，所以我现在点提交的时候可以看到输出 helloword 啊，然后我现在想实现什么呢？点提交的时候输出这个表单里有输入的内容，比如说这里输入一个哈喽，点 一提交的时候输出哈喽，那这个怎么实现呢？这个就需要一个新的知识啊，叫数据的双向绑定。什么叫数据双向绑定啊？就是这个音铺的啊，我可以实现，我可以使用这个 v 杠 model 绑定一个变量，这个变量是谁呢？我写个 get， 不是确认一个数据， 这个数据呢？还叫 msg， 等于，比如说就叫 helloword 了吧，我把这个 pose 先给他注视掉啊，先不用他啊， helloword， 然后我让这个音铺他通过微猫斗实现一个双向数据绑定，绑定谁呢？绑定这个 msg， 然后看一下刷新可以看到 helloword， 对吧？然后如果说我再写一个元素，比如说我在这里面写一个 h 一标签，然后这个 h 一标签也绑定一个 m s g 的话，那是不是这个 helloword 会显示到 msg 上，也会显示到这个表单里，对吧？那我们看一下刷新可以看到 helloword， 对吧？然后我如果改变那个表单的话，一二三，大家可以看到这个 helloword 也变了啊，一二三，一二三，一二三啊，一二三。 这个就是一个双向数据绑定，也就是说我这个 mac 值会绑定到这个表单上，而这个表单变了的话，他也会影响到这个 mac 值，他是一个双向的数据绑定啊，那我通过这种方式是不是就可以实现？ 呃，输入什么东西的时候，然后我 pose 输出谁呢？输出瑞士点买谁？输出这 这个十，对吧？就可以实现，比如说这 helloword 写个一二三，点击就可以在这弹出一二三了。 helloword 一二三了，这个就是呃实现获取表单内容的一个功能。然后咱接着讲那个就双向数据绑定的话，他他有一些， 有一些这个修饰符啊，什么什么叫修饰符呢？就比如说，呃，我现在还是这个 mac 值，给他写个空的啊，然后有的时候呢，我需要让这个 mac 值他是一个数值类型啊。咱们现在输出大家可以看到啊，比如说我这里写一个 一二三提交啊，可以看到黑色的，对吧？黑色的就是支付串啊，我输入的肯定是支付串啊， abcexd f 啊，这是支付串，对吧？那如果我希望我输入的是一个数值的话，我可以用一个修饰服啊，比如说在这点 number， 在这个微猫兜后面加个点单波啊，然后这样的话，我刷新我输一个一二一二三，再提交的时候，你看就变成蓝色的了，对吧？大家应该能看到吧，蓝色的他就变成一个数字了啊。 假如说咱们写一个呃单价啊，或者是数量啊，或者是说某个学员的年龄啊，这个时候的话，他需要是一个数字类型的，所以说我们双向数据绑定的时候就可以用这个呃，南博把它转换成一个数字类型的。 刚才讲的修饰服是男模的吧？有的时候，比如说我现在啊，我现在写一二三，他是直接触发这个双向数据绑定更新数据，对吧？有的时候咱不需要这么一直触发，咱需要 失去焦点的时候，比如说我写一个一二三，一二三，失去焦点的时候上面再变，再去绑定，而不是说写一个变一个啊。那这个事件其实就有区别了， 比如咱学盗墓的时候应该知道啊，我现在用的就是一个音铺的时间，对吧？我输一个就触发一次，输一次就触发一次，那我可以通过一个修复给他变成一个称，那怎么实现呢啊？可以用这个点 累积，点累积的话咱看一下效果啊，刷新，比如说我这里写一个一二三，没触发，没绑，对吧？然后失去焦点的时候，哎，一二三，然后四五六，然后没变，对吧？失去焦点的时候，哎，变了啊，也就说刚才他是基于音铺的实现双向数据绑定，而现在呢，是通过这个趁着来实现数据的双向数据绑定，然后还有一个去， 这，这比较常用啊，就比如说咱们现在想输一个用户名，我现在假如说写一个小名，然后提交啊，这个小名是没有问题的，但是有些用户他可能就一抖手，哎呗，我就输了俩空格啊，然后输个小名。大家想一下，输两个空格之后，然后输小名的话，用户可能是不知道的，但是这两个空格 可能就会直接存到，如果咱不处理的话，就会直接存到数据库里面，那他的用户名就变成了两个空格。小明，对吧？所以我通过一个趣木的话实现什么功能呢？实现去掉这个卖鞋子里的首尾的空格。那刚才咱讲双向数据绑定的一些东西。

分享一个很实用的工具库 view use 给大家看一下它的功能目录，简单地了解一下它能实现哪些操作。 它基于 newcom position api， 也就是组合式 api， 支持在 ur 和 u 三项目中进行使用，据说是目前世界上 star 最高的同类型库之一。它的初衷就是将一切原本并不支持响应式的 jsapi 变得支持响应式，省去程序员自己写相关代码， 像获取元素是否出现在屏幕可视区域，鼠标悬停页面的位置，在这里你只需要短短几行代码即可实现。 还有动态获取网页窗口大小、使用吸管工具吸取颜色、操作蓝牙设备、 打开系统文件检测游戏手柄等等。好像系统所需要的部分功能他都早已为我们准备好，白天黑夜模式的切换更是不在话下。 关于他的更多操作就不再一一演示，有兴趣的朋友可一步到官网去查看。本期分享就到这，下期再见！

大家看这个呆萌哈，我想实现一个效果，就是把这个页面所有的状态都攒存起来，包括这个页面下面可能还有一个分页的表格，所以呢，表格的数据啊，包括表格翻到第几页都能攒存起来，然后在刷新的时候呢，这个数据依然存在，所以呢用 keeper live 就实现不了。 那我就想能不能在这个暂存的点击时间里，用类似点刀乐贝塔来获取到这个 will 所有的贝塔数据？以后呢，把整个这个贝塔数据都存起来， 比如说我们存到 logo slow 这一只哈点塞特艾特，然后起个名字就叫随时，然后呢把它做一个 spa， 对，这样就能存起来了。但我遇到一个什么问题呢？就是把它 data 读取出来没问题，问题是往里放，有问题， 就是这个 data 属性他是一个止毒的，除非我们便利他里面紫薯性一个一个往里放，但这样就太麻烦了，那这个具体的报错呢，我就不掩饰了哈，总之他就放不进去。 后来呢，我就发现，其实这个逮他就是一个方法，在这蕊他的一个结果，所以我们可以直接在这去，比如说我们直接在这 logo story， 这点该他还疼， 叫 stys， 然后呢把它放到一边亮里，比如叫 stys str， 然后呢把它转成这次 就这样，然后在这锐特的地方呢，我们稍微改一下，用 oppods 的三音和三音原来的这个还放在这，只不过呢，我们在这加一个 space 的对象。好，我们再来试一下哈，一会给你讲，这边给你讲好，然后暂存，然后刷新，大家看这就可以了，包括如果这个页面还有表格翻页什么？这都没问题。

大家好，今天给大家介绍的是一个基于 spring boot 的会议管理系统，主要的开发语言是 java， 数据库是 mythical， 框架是 spring boot。 这个系统分为两个端，一个是小程序，一个是后台管理端，这个是系统的架构图，小程序端的用户可以去预约会议，进行会议审批，查看日程， 接收邮件等，然后后台管理可以去维护会议室基本数据，进行会议审批，系统公告管理，用户管理等。整个系统都是自己开发和设计的，如果同学有自己的想法，也可以来聊一聊定制开发。 接下来演示一下管理端，用户登录后，首先进入的是系统的首页，首页是 一个数据统计，然后包括会议日程以及系统公告，然后进入到会议室管理页面，在这里可以维护会议室的基本数据，然后会议预约只是进行会议预约，点击详情可以查看用户的签到情况及会议评价。 在会议审批页面可以查看需要待审批的会议，然后进入到系统模块，有用户管理，角色管理以及公告管理 下来演示。移动端用户进行登录后，可以看到有首页会议，我的三大板块，然后在会议展示是会议的列表，点击二维码 可以查看签到码进行签到。然后在会议板块可以点击日期，查看该日期下的一个会议日程，可以点击新增会议，进行会议的一个预约， 然后在我的可以查看公告以及进行一个会议的审批。 以上就是简单的介绍我们系统的功能，如果大家想要了解更多，可以私信，有详细的演示视频以及访问链接，附带还有一份文档详细介绍了整个系统。 这个系统有亮点的功能，比如说扫码签到及会议日程展示、会议评价、邮件通知及数据展板， 这些都是比较亮点的功能，所以他是比较适合做我们的闭设系统。由于整个系统都是自己开发的，所以能够帮助大家远程部署运行以及进行一个代码讲解。 然后如果同学想自己家功能，也可以来聊下需求定制开发。最后祝大家顺利毕业！

大家好啊，我们这期来讲前端面试的 vivo 响应是元宝阶段。首先 ctrl 的底层原理。 vivo 的底层它是怎么实现的？大家这个英语场景都知道。极端属性，其他手机在 vivo 里面用的特别多。它是对基础的属性进行二次封装，封创成一个自定义的属性。这种属性的计算属性是吧？ 可以理解。人副作业函数里面欠副作业函数肯定是这种对吧。对考察点也是对物有思想的认识，对基本功的掌握，吸收未有编程思想，为自己以后在公司中或者个人开发框架提供思想和技术的基础啊。看看这个例子吧， 三百打印你看。嗯，再跟大家读一下代码。当前的副作用函数，也就是当年的血染函数血染函数血染函数对象血染函数 清除所有的一代收集，把所有一代收集放在这个八 k 的里面。 代理拦截拦截代理 rk 的收集音出发收集音 trigger 出发副作业函数出发渲染重新渲染。只要改变手机圈重新渲染。那 come q 的能给封装的一个方法， 通常这方法这方法就是实现我们的计算属性。嗯，对吧。啊，对应的 函数传进来，你看我们这里面传的是啥？把这个函数传进来。我们封章的阶段属性。封章的方法等于 a 属性加上 b 属性。你可以把这个 a 属性 b 属性理解成这个里面的基础属性啊。基础的响应式属性。把两个小型数属性封张成一个阶段属性，这个阶段属性有， 也需要有响应式。所以说他必须要放在渲染函数里面是吧？只能副作用函数是吧？因为每个他也是个副作用函数，也需要进行一代收集。所以说我们现在只要勾结格的 a 改变一下，他就会自动执行这个方法对吧？ 这个里面 ob 的 a 加 b 等于多少？ a 一百， b 两百，现在把 a 加一加就是一百零一，加两百已经三百零一对吧。你看这里面没执行，我给大家做出来了，还可以执行， 你看三百零一。这就是我的面试题，你稍微给他改装一下，你让他这个自动出发，怎么出发？这就是面试题。如果对他能理解的不透彻，对这个基础巩固的不牢固，基础的代码都不知道怎么去写，这些同学肯定不明白对吧？所以说，把这些东西搞 明白，你的基础一定要扎实，你才能看得懂。看得懂的前提下，你再去把它思想吸收，思想吸收，你再进行优化，这是一步套一步的对吧？所以说读元码，将元码真正吸收到自己大脑中，这也是我们非常好的学习过程啊。我们在工作中，尤其大厂里面都有自己的一套框架， 好多框架都是看别人原码，把别人原码吸收给自己，为自己所用是吧？如果你想进大厂，我姐肯定是问这些东西，我不会问 aps 怎么调用啊。大家看看现在答案在评论区打印出来啊，一起分享。谢谢大家，谢谢大家！