vue3动态设置iframe src
粉丝833获赞7588
相关视频
05:10查看AI文稿AI文稿什么叫动态组件呢？比如说咱做一个手机端的页面，我先说一下咱要实现什么功能啊？咱画一下啊。那刚才咱说了，就是比如说一个手机页面啊，一个手机端的页面的话，他可能分成几部分，分别是什么呢？分别是一个 top 啊，一个单宁， 一个堪称点和一个服帖啊。那这个咱写一下，这个就叫 top 组，这个叫班的组件， 这个叫天天的主角，这个叫福特主角。那，那假如说啊，比如说我，我现在是一个会员啊，那你中间搬，那是一个广告，对吧？那我会员的话，你，你不能老让我看广告啊，所以说我是一个超级尊敬的 vip 啊，那你怎么办呢？你把广告给我去掉，我 打开这个 apple 的时候，我看不到广告，我只能看到这三个。然后如果说你是一个普通的用户啊，你是普通的用户的话，那你不交钱没办法，你只能看广 广告，那你看广告怎么办呢？你呢？就能看到这个版本，所以同样的代码，同样的 apple， 我看的时候就没广告，你看的时候就有广告，甚至可能我看的时候这个富态在上面，他不在下面，反正我开心，对吧？我开心，我是，我是 ip， 我想怎么布局就怎么布局，而你呢？只能看斑点哈，所以说是一个这个功能，那这个功能如果说放到 w 里面去怎么实现呢？ 首先第一点就是说我需要让这个页面他是根据数据自动生成的，而不是说写死的，写死的页面，对吧？啊？是根据数据生成的，他数据可能是这样的，比如说我现在，哎，有一个，有一个，这个，呃 呃，叫利斯特，一个列表，这个列表上显示你的页面啊，第一个页面呢叫叫卖 top 吧，卖 top。 第二个呢叫卖班女啊，第三个页面 叫这个卖干净点，第四个页面呢？我得换个，行啊，看着可能舒服一些。第四个页面呢叫迈夫特，咱用实验这个功能啊，也就说数据是这样的，那你就给我这么的演示，假如说我是 vip， 我没有版本，我就看不到版本 啊，那你那我 vip， 我可能，我我我想看两个套吧，对吧？我心情好，我就是 vip， 我牛，我看两套吧，那你就得给我展示两个套吧。那这个怎么办？这个怎么办啊？ 那我就可以用动态组件来实现这个问题了，实现这功能了啊，那，那怎么写呢？首先我肯定是需需要把这些都引进来，对吧？那这个是没跑了啊，我需要引一个卖套啊，是这个卖套 买斑点，是这个买斑点，买 cant， 那是这个买 cn 点，卖 top。 哎，这这这个不用给了， top 斑点买福特抖音引进来之后我还需要注册， 注册，那我现在注册也注册了，引入也引入了，对吧？啊？然后是卖套盒，买班证，买，看，这还买福字啊，四个，那四个，那我接下来呢？接下来要干什么呢？就是用动态组件康复的标签啊，来实现显示刚才的那些 组件啊。那科目呢？是他有一个属性叫 e 字，对吧？ e 字，比如说我这个 e 字等于 mate， 咱看一下现在的效果啊，这是咱那个 mate 没写东西呢，是吧？ sunprahe， 这个叫 mate， 然后写个 stele， ste， 这个是包墩一片手里的 rap， 呃，写个灰色的黑色啊，然后再写一个，呃，高度是一百 像素，然后看一下现在效果啊，哎，换成手机效果，卖 top 有了啊，对吧？卖 top 有了，然后呢？我现在，我现在在回到这个 app 啊，比如说我现在想显示卖 top， 买单的，然后买强劲的，然后买福气 啊，那这个组件 come on 的呢？他可以写个义字，义字等于谁呢？等于咱们那个想要的组件 come on 的，买套房，买 单点，买康定点，还买福卷，哎，咱们现在都有了，但是咱现在想实现什么功能呢？刚才说了，我希望通过这个数据数据来实现，所以说我刚才那个代码是写死的，那我就可以用这个利是他来实现一个便利，便利之后呢？把利是他里的数据呢？给他显示出来。好，那咱再回来 就写一个康不能陈，写个康不能陈，然后呢？我这里写一个为父，便利谁呢？便利这个 立死他，对吧？艾特姆因立死他，然后这个艾特姆呢？就是咱想要的组件了，弄一些艾特姆，然后这里写一个绑定属性啊，然后保存，然后看一下现在的效果啊， top， 斑点抗性的服务题 top， 对吧？然后我现在只需要改变数据，比如说我现在数据变了啊，我是 vip， 我不想看斑点 删掉，而且我只想看两个套盘，我喜欢看两个套盘，然后回来斑点没了，对吧？然后我想看一个套法在上面啊，一个福特也在上面，对吧？咱 vip 嘛，就个性嘛，我想咋设置怎么设置 啊？福特在上面啊，两个套吧，没有斑点，然后一看福特在上面啊，那通过这种方式的话，我们只要到后台去把数据拿过来，就可以自己去组装咱们想要的页面效果，这个就是动态组件的一个共功能了，用数据来驱动视图。
536晓舟
05:34查看AI文稿AI文稿element plus 是基于 vivo 三的组合式代码风格进行开发的，所以我们几乎没办法通过继承来修改或者定制化它的组件， 所以呢这种情况我们就只剩下一条路，就是我们基于他官方的原代码进行二次开发，顶多呢就是我们定期的合并他官方的发行版。其实很简单，首先呢我们先把他的原代码克隆下来，这块我已经克隆好了，在这里哈。然后呢我们先做一件事，就是我们创建一个分支，我这里叫 my 二点三，为什么呢？ 因为大家看他现在的最新发行版是二点三点一四，我们呢就不要最后这个小版本了，我们直接到二点三以后的话呢，我们定期合并他这个小分值，比如他二点三点一五发布了，我们还把他的二点三点一五合并到我们这个二点三的分值里，然后就简单了，我们就任意的改他的原代码就好。 好了，改完之后怎么办呢？我们用 p n p m， 注意它用的是 p n p m， 包括你意思带有的时候，然后 p n p m build， build 完之后呢，我这已经 build 好了，他会生成一个 distant 目录，目录里有一个这个 element plus 目录，这个目录就是未来我们项目需要引用的那个 element plus， 怎么把它引用到项目里呢？我给大家分享三种方式，大家根据自己的情况去选择。第一种呢就是我们把整个这个目录啊 放到我们的项目里边，我这块呢已经放过来了，我建了一个叫 depth 的目录，把刚才那个目录拷 pit 过来，我这已经拷 pit 好了哈，下边这个先不管他， 然后怎么做呢？大家看，我现在用的是一个普通的 button， 就这儿一个普通的 button， 然后呢，大家看啊，我把它原码里稍 稍微做了修改，在这加了三个等号，就是在这个文字前面， slot 前面。然后呢，我现在重新安装一下爱了们的 plus， 用，我打包过来这个安装。首先呢，大家看啊，这块引用的是 官方的 element plus， 我先把它卸载掉 instyle 好没有了，对吧？然后呢，重新 instyle i element plus， 注意后边加空格，点 depth， 然后 ilement plus， 这样就可以了，指向这个目录哈，我们回车， ok， 大家看，这块的路径就变成这样的了，我们再来试一下 mpm 软， 刷新一下，大家看他前面就有那三个灯号了，说明现在用的这个 button 就是我们刚才改过原码的那个 button 了。 那第二个方法呢，就是大家也看到了，我们需要把刚才这个 element plus 目录打包成踏点儿 gz 文件，怎么做呢？就是踏儿 z c v f， 然后呢起个名，然后注意有一个杠大写的 c， 然后呢选中了刚才这个目录，最后有个点注意这个杠 c 很重要，这样的话他生成的这个压缩包中不会有这个 element plus 这个目录，否则的话你在 npm 安装的时候总会爆，找不到 package。 好，这样打包完之后呢，他就有这个文件了哈，我们把这 这个文件放到我们其他的项目里，像这样代不死，然后点踏点 g z， 然后这会我们把这个文件先删掉哈，我们为了测试停一下，然后还是我们先把这个 nstyle 一下，卸载一下 pm， 好，我们重新安装 i element plus， 这回我们点 tar， 点 g z 好，安装好了 m p m run， 我们再来试一下，刷新一下，大家看也是一样的效果。那这个方法相比直接复制目录过来有两个好处，第一就是磁盘空间，我试了一下，他大概节省了十倍的磁盘空间。第二个呢， 就是这种压缩包，我们可以避免不小心修改到里边的代码。第三种方法就是我们直接把这个目录放到公司的 get 私服上面，或者 get up 上面，我这里边拿 get up 举例哈， 我在我的 github 上创建了一个 my element plus， 然后呢，把这个目录直接放上来了，而且我们放上来的时候注意我们还可以 打太个，比如这是二点三点一四，我又加了个点幺，未来我再改就是点二。然后呢，我们还是在其他项目做安装的时候这么做，我还是先摁一下， 然后呢，我们复制 dtap 这个目录， h t t p 的就可以哈， n p m i element plus， 然后把刚才那个链接直接粘过来就可以了，如果你想带版本就加， 加上井号，二点三点一四点幺回车。 ok， 安装好了，大家看格式就自动变成这种 get up 冒号了，大家注意这是 no 的，十六版本以后会是这样，十四版本的话他就不是这样，他就直接是这样，哎，他一直加上一个 tps 冒号 get up 是不是嘛？ 然后呢，我们不管他啊，我们再来 n p m 软一下，我们看下效果刷新啊。对，这个我刚才打包的是两个减号的版本，不是等号哈。
6973程序员小山与Bug
03:21查看AI文稿AI文稿view 是用于构建 ui 界面的 javascript 框架，提供了简洁的语法与完备的官方文档， view 已经逐渐成为了最具影响力的前端框架。相比传统方式， view 大大提升了开发效率。 在传统开发中，无论是数据呈现还是用户交互处理，都离不开复杂的盗墓操作。为了实现一个简单的功能，动辄就要书写几十甚至上百行代码。 随着外部应用的日渐庞大，复杂的代码让开发者们叫苦不迭。而要将代码迁移到框架，大量繁琐的规则又让开发者们望而却步， 这时为有应运而生，以更快的上手速度和更低的项目迁移成本迅速改变了这一局面。当真是功能全面、生态好、语法简洁效率高，免去盗墓 操作苦，开发重任一肩挑。你有病，咱们言归正传，要使用 view， 你可以通过 cdn 引入方式来将 view 应用到整个页面，或者直接通过官方交手机啊 create view 来创建完整的 view 应用，并安装可能用到的辅助工具。 要编写 view 代码，可以找到项目中以 view 为后缀的单文件组件。组件代表了网页中的部分功能，每个组件都包含独立的结构、样式和逻辑，对应到组件文件中的 tablet， style 和 script 标签。 你可以在他们类的标签中书写 html 作为组件的结构，或者引入子组件让结构更好的复用。如果你想将 gs 中的数据插入到结构里，可以使用差值表达式。在差值中，你可以书写一些简 单逻辑，或者直接调用函数进行数据处理。除了差值， vivo 还提供了用来替代盗墓操作的指令功能，如 v 杠 text 可以为标签设置纯文本内容。 v 杠 h t m l 可以生成标签结构。 v 杠 if 可以根据数据判断是否要渲染这个元素。 如果你希望渲染列表数据，可以使用 v 杠 four。 要设置事件，可以使用 v 杠 on。 指定的值是事件处理程序，当然，你还可以使用艾特来简化书写。除此以外，如果你希望组建的数据可以动态更新，可以使用 vivo 中提供的方法将数据设置为响应式。 对于对象值，可以使用 reacttif， 而对于不可变的原始值，则可以使用 ref 将其包裹为响应式数据。当这些响应式数据发生变化时，它会自动传递到模板的对应位置。组件将自动重新渲染 而无需任何 dom 操作。当然，这是因为框架在幕后执行了大量工作，以确保这次更新的性能最优。这类功能被称为虚拟 dom。 对于虚拟 dom 的实践细节，大家可以三连催更。 而对于 vivo 来说，你还有很多需要学习的功能。例如，想要缓存数据，你可以使用 compute 的计算属性。如果想要在数据变化时执行指定操作，可以使用振停器 watch。 如果你还需要进行路由和状态管理，你则可以使用官方的路由管理工具 vivo rotor 和状态管理工具 pinning。 正如之前所说， vivo 提供了完备的官方文档，你可以在文档中快速找到并学会你想要的功能。以上就是一百五十秒搞懂 vivo 三的全部内容了。如果你喜欢我的视频，可以给我点赞或者三连。如果你有想看的内容，也可以在评论区跟我互动，感谢你的认可与收看，我们下个视频，再见。
4401吴悠讲编程
09:02查看AI文稿AI文稿好，这节课呢，我们要说的是路由啊，就是那个 rooter， 那这呢大家要知道一个点，就是 view 点 g s 呢，它是作为一个核心库存在的，那其实呢， view 的 rooter 或者说呢， view x 啊，都是属于你可以这么理解， view 点 g s 一个插件， 那所以说呢，我们要了解的就是 view router 三的版本和现在四的版本，他们之间有什么样的一个区别，或者说呢，从三到升级到四，具体新增哪些东西？ 第一第二呢，就是在六点 gs 这个 set up 组合是 api 中，怎么去用这个东西啊，就是我们要了解这么几个点，那路由这块呢，无非我们作为使用者来说，最需要知道就是怎么跳转音量对吧，跳转传直啊，传直啊，还有这个导航守卫 啊，动态路由等等等等一系列东西，还有路由的模式是吧？ hitter 哈西模式，这是我们需要了解的，行到这呢，我们就依次去看吧，其实呢改动并不是特别大，那首先呢，我们要看的是 router 下的一点小 gs， 这是我们 router 的一个配文件，对吧？然后呢，它的第一行其实呢和之前就所差距啊，那第一行它是 loser， 然后这儿呢是 created 外 petri， 这什么意思呢？模式对吧？ petri 模式，那相信各位小伙伴呢，也知道它的模式，比如说黑 tree 模式哎，颜值很高的这种模式，对吧，就是 url 好，那其实我们这儿呢是无需写这个杠的啊，不用写， 他默认的就是直接这么一个样式啊，直接这么样式啊，那如果说我们在做后台管理系统的时候呢，我们经常会加一个，比如说啊的命啊，那这时候呢，他的首页就变成了一个 logo hose 的三千，比如说啊的命，是吧？到这里边关于我们就变这个样子， 好，这是我们可能需要去修改一些点，哎，那现在呢，明显是一个黑制模式，如果说我要改变成一个哈西模式呢，大家可以看这个地方的 a p i 啊，就是这是 router a p i， 然后呢他也提供了叫 craterbab 啊，哈西喝水，看到了吧，你可以把这个呢给他拿进来，然后呢在这使用的他，是吧？然后呢我们现在刷新页面，哎，刷新一下啊，大家看是不是加了个井号啊，哎，这就会走哈西的这种模式啊，所以说呢，这块本身改变的并不大，对吧？ 那大家呢，也都知道这种模式存在，那么具体你相中哪一种模式啊，以及它模式区别啊，那在二的时候呢，大家就应该知道的话，这我就不做过多说明了哈。然后呢还要需要提醒几个点，就是它其实呢含有这么几个东西 api， 大家下去呢也可以看看，不过呢，呃，特殊场景下会用到特殊东西啊， 那我们日常开发来说呢，就是，嘿，其实哈气就够用，好，这块呢，我就给大家介绍一下就行了。好吧，这两种模式本身改变并不大好，然后呢还有一个比较重要，就是，哎，跳转呢，对吧？原来我们通过什么 roselink， 现在呢也是一样的，也是一样的，我们可以试试啊，比如说这有个 roselink。 好，然后呢，我们比如说要跳转到关于我们这个页面，那这呢就写一个 to， 对吧？然后这个地方呢是关于我们这个页面， ok 然后呢现在我这拍一点啊就进来了这个地方呢就没改变啊就没改变啊。然后呢你要通过 gs 方式跳转呢也是一样的啊也是一样的。例如啊我这地方呢是有一个 banana 吧啊然后这呢 可以加一个事件啊，我随便写一个啊随便写一个然后呢你可以通过 set up 形式去写啊。好，那我们就跳转。好注意啊那这样吧，我先去写一个简单式 aps 那过去我们怎么去写呢过去我们要写的话呢就得这么写呃 messy 是吧。然后这儿有个 go 然后这个地方有一个 lace 点儿什么 rooter 点 pose 啊 啊跳转到这个关于我们这个页面好来试一下耶。哎也进来了是不是那。呃现在要用 set up 呢，比如说这儿我要写个 set up 注意 set up 里边呢是没有 this 的啊再说一遍是没有 this 的啊。所以说呢我现在 console 类 console log 啊打印 this 呢是肯定打印不出来的啊我们可以看一下。 扎心是吧他这已经给你返回了 itunes 是吧是没有的哎没有的话呢该怎么办呢啊这就是一个我觉得啊挺大的区别了，和之前呢比较大的区别啊，你得这么做呢你这样 import 然后这是呃这个 use 啊，比如说叫 root 和 use rooter from 啊这是 view rooter 啊这么写 ok 那我分别呢把这两个东西说一说哈。 来咱们就列举到这那首先呢这个地方的 root 啊，就是我们原来的类似的多少服 root 好吧这个 root 呢就是我们原来的类似的多少服 root 啊。那这样的话呢大家就很好去理解了，也就意思说我们要用的时候该怎么用呢啊，比如这 go 啊，我把这就删了啊，删 let's go 等于，哎，这是一个函数啊，就显示这个函数，然后把这 go 呢给它 return 出去。 好，然后在这呢你就需要做事情这样的看到啊，我们要用他，对不对？他，那我现在呢先 ctrl 一下啊，他返回的是一个什么呢来看啊，点一下是一个函数， 那么所以说呢他在使用的时候呢，你看插一下 reaction 这个东西，所以你用的时候呢有两种方式，一个是加括号啊，一个呢是弥补一下。哎，这两个呢都是可以的，大家来看啊，他返回东西呢是一样的。好，再来分一点。 咦，这地方加括号怎么没有个返回东西呢啊？我应该要在外面去用啊，那我在这呢先给他写一下 等于。好，我把这个打印出来刷新一下点。哎这呢出现两个东西啊，一个是一个对象，一个这个呢也是一个对象。好，他俩呢几乎是等着二的啊。好走点。虽然是 force 啊，但是呢都可以实现一个功能啊，比如我举个例子啊，那么现在呢 我去 console 一下好点，然后大家看这里边呢它有什么 go 呀， photo 之类的对吧。那所以说呢现在就可以直接什么 poot 然后到这个页面。好，这样的话呢也是可以的，来试一下刷新 点，你看进来了是吧，用刚才那种命的方式呢也是可以的啊，我应该在外面去用。呃算了，我在这换成这个六吧。 ok， 然后到这，因为我要加括号去 这地方要加括号，算了，不加了也是可以，我们把这个也打开吧，你看他能不能跳转啊，刷新点是不是也可以跳转啊？ 所以说呢，呃，就是呃，无非就改变了这么一个点啊，无非改变这么一点，我们要用的时候呢就需要这么用。好，那这样呢，我再声明一下啊，哎，这个东西呢，我要在每个页面，比如说我要传直接时都需要引入一下，能不能像原来我们那个引 pro 的什么 if 之类的别引出来，其实我们先不引就可以了，来试一下啊。刷新点为什么呀？ 因为我们之前安装过一个插件，而这插件呢，我们这配了 view 啊，说白了就是 inpult 是吧，我不管你这写啥 prom， 哎，这个 v 我对应这儿还有一个 input， 我不管你这儿写是啥，哎，但是呢，我有一个这个， 那大家看刚才我写的时候是不是在这个地方有一个 flow 什么什么东西对不对？哎，就是它，好吧，所以说呢我们就可以直接用了，但是你要知道这两个东西啊，如果没安装插件是一定要拿过来，好吧，那几乎没什么区别 来，那到我们的三 w 语法堂呢也是一样的啊，那你可以比如说把这个拿过来，然后到这对吧，然后也是拿这个，或者我们就叫它 roots ok， 来，首先点，哎，你看也过来了，哎，就非这么点东西啊。这个改变，那我就不详细介绍 root 和 root 的哈。这个如果大家做啊 view 二的这个项目，或者说呢，你了解 view 二，那这个东西你肯定是知道他们区别的是吧，一个是当前路由，一个是大对象是吧，这两个是不同不同的一个点啊。好，然后呢再往下呢？还有一些比如说， 呃。就这个导航，所谓啊导航，所谓啊动态路由和之前呢一模一样，你就可以这么去理解啊。原来怎么写呢啊现在你还怎么写？比如说啊，这个 router 点儿 before 是吧？ each， 哎在这地方你该怎么写怎么写 啊。我抗作为一啊，先抗作为一开心啊 before h 哎。怎么不出来 before h。 嗯在 a p 里边儿，比方 enter， 诶，在这儿，呃 rooter 点儿。哦我这写的是有问题的 呃。我先把 rooter 打印一下，咱们来看一下这个 rooter 啊，来刷新。没关系啊，就看这里边的这个内容吧。这里边它有没有，呃比如说它有 after 意识是吧？有个 b for 意识，那就可以这样了。 这一点好，我把这个 com 过去 be for e 是不是写的是对的呀，大家看他是不是返回东西了对吧？然后呢我在这呢我就给他传过去一个东西， 好到这呢咱们打印一下。这有一个，呃我随便写吧，就是我的第一个和第二个以及 nice 我把这三个都打印出来大家看，呃第一个当前是吧，然后这个是 nice， ok， 都是可以的啊。就是这个，呃录 这个导航手背啊也是一样的好，比如我这啥都不写，哎。刚才我写错了啥，到底是是吧，现在就进入不了这个关于我们了对不对？然后你可以 next， 这样的话就可以进去了， 这样就可以进去啊。至于导航首位判断呢和之前一模一样，你就该怎么判断怎么判断就行了啊。这是导航首位是吧？然后呢动态路由，哎。该绑定什么？比如说冒号 id 和之前呢一样，和这一样，所以路由呢，并不会给我们带来很多的学习成本。好吧，就无非大家要注意一点，在 vivo 三中，你怎么去写啊？那你可能会 比如说 use 啊，传值什么的也是一样的，我就不演示了啊，传值也是一样的，这是路由对象啊，你要接收值的话，我们翻这么减点儿，比如说 carry 是吧，那么现在呢，就等同于这么去写啊，好，我们可以 console 哎，有没有参数呢？我把哎这个数角 root use root 写错了， 好，来，再来重新好当前的路由对象， 然后并没有 carry 是吧，那我就不打 carry 啊，当然你也可以传一个是吧？可以传一个，比如说我在这传一个 a c t 等于一啊，我们来看一下，然后在这有一个 query 啊，在这啊，有个 value 是吧？把这打开， a c t 等于一，那么你要拿这个值呢，也可以去拿，就是 carry a c t 啊，那一就拿到了， 对吧？这就和这样写线基本差不多啊，传直还这么传，接还是这么接，无非就是这个对象，我们先要这么去写啊，原因就是三叉里边并没有类似啊，这点大家注意。行了，那么有关于这个路由呢，我就先说这么多了，基本上呢，就够大家去用了，去使用了。好，本节课呢，我就先说到这里。
50小爽AI产品经理
22:20查看AI文稿AI文稿好，接下来呢我们要做内容是登录这一块了，那下面呢来看一下学习路线点 cn， 这个网站的一个登录页啊，大体一个样子啊， 那他登录方式呢？分为三个内容，分别是第三方登录，第三方登录呢是微信、微博、 qq， 还有第二种方式呢是这个账号密码，第三种方式呢是短信验证码。那到这呢我们就一个一个去实现，先来实现这个账号密码的一个登录方式。 好了，回到我们这个地方，那首先呢第一个我们要做内容，就是先把这个 login 这个页面给他创建出来，对不对啊？然后呢我们去给他路由上进行一个引入，那这样的话呢我们就可以跳转到这个页面了，然后接下来呢我们分析大概要做的东西哈，行，那我们先回到这个项目里边，那我就给他打开了哈， 来，那到这呢我就给大家新建一个 large 点 view 这样的一个页面啊，这样呢，我写一个 topic， 这是我们的登录页。 好，稍微放大一点。行，然后现在呢再来找到这个 rooter 点 g s， 好，把这呢再给它多一个，那这呢就是捞紧。好，然后呢这个地方也写一下 那，呃，这都换成小写吧。好，然后，呃我们这的这个老茧， ok， 行，然后呢再跑到那个地方的一个，呃，憨豆啊，这呢我们要多加一个来往下走啊，不是在这啊，在这，那，这要加一个 rooter link 啊，然后把它放进去， ok， 然后到这呢我们需要有一个兔 到我们的 logo 里边就可以了。好，那这弄成一行吧，然后下面呢我们来看一下，那这呢会出现一个 a 链接，对吧？那在这呢，我们把这个 c s 样式呢也调整一下，好，到这个地方我们加一个 a， 然后再给他去除一下下，划线好点，他以后进入到我们登录页。行了，那 下面呢，我们就来看登录这块的整个的内容啊，那到这呢，我也是打开一个学习路线点 cn 吧，进行一个账号登录，然后咱们找到那篇文章啊，不过，呃，不登录也可以啊，只不过呢，一会我们还要看接口啊，所以说呢，我这登录一下 啊，然后这个呢作为一个参考啊。那到这呢，我们就先去捋个，这就是我我要做的这个账号密码登录啊，需要做哪些操作啊？ 首先呢，我们做操作是这样的，来往下走在第二十一， 好，来我们分析一下操作，这样的，那我们的账号密码你肯定是要有一个请求，对不对？然后把账号密码传给后台，传给那个后端，那你不可能是通过铭文进加密的，对吧？你不可能是铭文，你你肯定要加密码，所以说呢，我们这加密要走啊，咱们要走一个加密。好，这我也写了，然后等 登录完事以后，我们都知道登录完事以后呢，会有一个 token， 那个 token 我们要进行存储，那在之前呢，我们会呃存到本地存储，再加上 vivo xo， 那么现在呢，我们就是用 pena 来操作这个事情，是吧？ pena 就可以完成这个事情了。好，所以说呢，我们要做很多很多东西的。好了，下面呢，我们就一步来啊，我先把这文章放到这， 那我先去拿一下整个的这个网页的布局吧，先把这个布局拿过来啊，这写了很多东西，我先整个给他复制粘贴过去，然后呢有些东西我该删呢，删一删啊，然后给大家去讲一下。 嗯，在这个地方有很多东西其实已经弄了。呃，我先把这个地方的一个呃 g s 部分吧，先全部给它删一删。稍等一下，我把这儿呢都删掉吧，就先不要这个部分啊，这个部分是我之前写的啊，然后这儿呢还有一大堆 a p i 什么的，这些我就都不要了。好，然后我们回到这个页面中，呃，他出现错误了，我们看一下哪出现错误了哈？有一个 user name 啊， user name 这个不能删，那我找一下，是我们的一个数据啊，我把 这个部分先给拿过来，好，再来看一下。好，那现在呢？我们的页面内容算出来了啊。好，我把这保存一下，然后呢他这呢少两个图片，应该是我看一下 这里边内容还是不行的，我再来看一下啊，好，这是 ok 的了。好，但是切换呢就出现了一些丢失情况，我们先不管了。然后这呢，呃，他丢失一些图片，这些图片呢我也给他拿进来吧，放到这个地方的引魅值里边啊，把这两个呢给他干掉。 ok， 好了，我们再刷新一下啊。嗯，要多刷新几次了，看来 或者说我把这重启一下，好再来。 ok， 那他有一个背景图哈，然后第三方登录证呢？我们先不管他，咱们先来做一下这个账号密码登录这一块，那分别给大家说一下这里边的这些数据啊是怎么回事哈。 呃，这就不用说了，这是我们的自己图标啊，这是我们的自己图标。然后这个呢啊，这个地方数据，比如说这有一个 login test 吧， t s t 是账号和短信登录这两个数据，比如说我这写个一，这写个二。好，我们刷新一下， 你看这有一个一，这有一个二，是做一个切换的，那么这一切换完事以后为什么没有数据了？一会咱再说哈。好，然后呢？这有一个，呃， current 为一啊，为一， 那它的初始为一，我们去找一下啊，它这有一个判断的啊，它判断是 id， 有一 次说，呃，如果说一等于了 id 为一的，那么就展示这个，对吧？当我点击他俩的时候会有个切换，他是 id 为一，他是 id 为二，所以说我会把 id 付给 karent 的 v 六，那这样的话呢，这两个值就进行切换了啊，这是两个布局板块嘛，他进行一个开口切换啊，然后再往下看呢，这个地方， 这个呢是我们的这个账号密码登录整个一个 r e f。 好，然后这个这两个呢？呃，这个地方的 user name 和 p w d 啊，是这儿和这儿输入的内容，也就说 we got model 啊，输入内容好， 然后呢，这呢是账号和密码的一个啊，登录这块的一个验证啊，就比如说我们的这块你输入的位置，比如说你输入的是，呃两位或三位，那肯定不满足我们的要求啊，所以说我这限制了最少三位，最多十一位啊，密码也是一样的啊，这是这的一个验证的规则。 好，呃，然后呢，其次就是我们这呢有一个登录按钮，当我点击了登录，我们来看一下啊，把那个登录要拿过来，好，把这个放到这， 这个是，呃，账号密码一登录好，是这一块，就是，呃，我们现在呢，这个地方有一个登录，对不对？我这输入账号，输入密码一点登录啊，然后这呢提示啊，就执行这代码了，说白就这样子。好，那么在这呢，我们看一下子，他为什么这切换是有问题的啊？ 然后我把这原码呢，到时候给大家去替换一下吧，他说我这个东西，嗯，我这我就先不要了，这不要了，这个地方 ctrl 就是账号啊用户名和密码登录成功，或者说叫 验证成功。好，然后这呢我们看一下这个切换是为什么？这切换这出现了问题，那就肯定是，呃，这啊，我把这个地方先给他清一下，这不要了，然后这个 vgo model 什么的我也都不要了， 那这些部分呢？我们下一课再做好。再来，可能是那块的数据没有，所以说他导致一个错误，好，现在就 ok 了啊，这也不会报错了。好，然后我们测试一下这吧，比如说我说一个一， 呃，它提示我成功，那这儿肯定是不对的，我们看一下这儿数据哪出错了？ the name 和 p w d， 然后这儿是 上面是内蒙和 p w d， 看一下啊，上面是 user name 呀，然后这儿叫 user name 啊， 那这儿写错了， user name， user p w。 好，这样验证柜子它就有了，来输一下一，好，大家看来刷新一下啊， 比如说我这输个一，他提示我三到十一倍，对不对？好，那这时候呢，我把这个文章改一下，那就用现在我们的这套模板就可以了，我找一下我的补课啊，他做的时候呢，直接可以用我们这个文章去做，然后里边呢有一些重要点我会给大家去说啊，这只是一个布局内容啊，修改一下，把这个整体，这， 那这个整体内容我就给他删掉了，然后把这个加上，好再发布一下。好的，我们就去看一下这篇文章，那现在呢，我们这样呢就已经 ok 了，那下一步我们要做的事情呢，就是我这输入一个 账号，比如说我的账号是 tys 啊，我这呢也给大家去放上这个测试账号啊，测试账号，呃，这个地方的用户名是 tys， 密码是 admin， 一二三，应该是啊，然后这是 admin 一二三。好，我一点登录，那他就可以登录上了，那登录成功肯定会给我返回个 token， 如果失败了，那，那当然就失败了，对不对？现在是我的这个，呃，前端做验证是通过了啊，我们这还没有去请求接口。好，那么现在呢我们就要去请求接口了， 来回到我们的这个接口文档里边， 那在这呢，我们就看一下这课程六三吧，直接搜啊，这有个接口文档，我们点进去，然后在这呢有一个 登录啊，然后有一个用户名密码登录。好，那么现在呢，我们需要去这里边 a p i 里边新建一个 g s 文件，对吧？我们叫 user 吧，啊，或者说就叫登录吧，登录点 g s 叫 login 点 g s， ok， 好，进来， 然后在这儿呢我们需要把 request 啊进行一个引入。好，然后呢？其次我们这个请求呢是一个 post 请求，那我们再去拿一个之前写好的 post， 然后呢我们这儿做的是用户名密码登录，把这个呢拿过来，然后这儿呢是有一个 api 地址的，我们就给它粘过来。 好，然后呢这个地方我们的名，是吧，就用这个就可以了。好，呃，然后我们再看看啊，这个地方应该没有问题了。好，那下一步呢，我们就要跑到这个捞针点，必有中。引入啊，引入来，那我们这就是 a p i eport， 它是一个名。好，然后下面是 strong， 我们要找找到呃，这里边儿的 a p i 文件的 login 点 g s， 对吧？好，那它呢 就要发送请求去，就是你的验证成功了，对不对？我们就要发送请求。好，那这时候呢，我们这样呢需要去传递一些参数哈，我先 ctrl log 打一下这个 i s， 然后这样呢，需要传递一个参数，那么他传递参数是什么呢？ 哎，在这有一个 username， 对吧？还有一个是一呃 password， password。 好，那正好呢，就是我们上面的它的 username 和它的 user p w d， ok， 就是我，我们这 v 港 model 啊，说白了就是我们上面输入的，对吧？在这儿呢输入的内容啊，这是用了 m g u i。 啊，输入的内容看到了吧？啊， v 港 model。 好，我们回到下边，那么现在登录就 ok 了吗？注意，你现在是铭文的哈，现在是铭文的，所以说它是不行的，我们来看一下。好，当 我现在呢去提交一下，比如说我现在呢点击一下登录， ok， 他会返回一个四零三，看到了吧？好，我们需要给他进行加密的传输。好，这时候呢，我们就要做下一步了，来看我们的文章。 好，我们需要呢去下载一下，来到这呢下载一下啊，点 i 复制一下。 好，下载一下，下载完事以后啊，我们需要给它呢创建一个 g s 文件。 在笔记中呢，都写了啊，咱们就需要创建一个 a s 点 j s 啊，当然这个名呢就随便起了啊，我就放到这工具里边了啊。好，然后把这个代码拿过来，这代码具体内容是什么呢？给大家去稍微的说一说。这 m d 五加密是不要的啊。呃，就看一下这个地方吧。首先呢，这是我们刚下载的 做了一个引入，这是解密的，这是一个加密的方法，这是一个解密方法，重点是这个地方啊，就是十六进制的一个什么密要之类的，这个呢是你跟后端之前就规定好的，所以说呢，我们这就不用管了，好吧，然后呢，只需要引入一个加密的方法来回到我们的 logo 点六中 啊，这是加密一 pro 加的 a e s。 好，那在这呢，我们需要把这个内容给它扩起来，那么这样的话呢，就是加密后的数据传给后端，那这样就没有问题了。好了，我们在这再来试一下， 来看一下我的这个检查，现在呢，我点击一下登录走，哎，刷新一下啊， 啊，我们这还没有去启动这个项目，我们启动一下，呃，文章里边呢，我再去改一个东西， 把这个 md 五这个就不要了，因为确实用不到登起来了，我们刷新一下页面，我带大家看一下哈，现在呢，我随便点一下，大家看是不是返回数据提示我登录成功了，那如果说我这输入的比如是别的啊，那可能就是登录不成功了，例如我这输入一个这样东西啊， 这时候呢已经不对了啊，我们就随便的加点，再来看，这是账号密码和错误对不对？好，然后现在呢，我们需要去看的一个东西，就是在这个地方的一个网络啊，我们这呢会给他发送一个请求。 好，这时候呢我们来看一下具体的这个内容啊，大家看这个地方的一个 password 也好， user name 也好，都是我们加密后的啊，这样的话就没有问题了。好的，行，那一旦我们登录成功完事以后，比如说我这儿输入的是呃 呃正确的，那他会有什么样的一个反应？因为如果错了，我们还要做一个提示，对不对啊？我们先来输入一个正确。 好，那这时候呢它的一个 cod 码呢？为一万零六是吧？所以说呢，我们这儿啊可以判断一下，也就是 r e s 点 meta， 点 code 是吧？如果等于了多少呢？这个值，那么就代表是登录成功 啊，这边是登录成功的啊，否则那就是登录失败啊，所以说呢，我们在这要提醒一下，当然你在这呢可以去这么判断， 如果说这 coat 码非等于非等于这个值。好，那我们这儿呢可以做一个提示。呃，我们可以用一下 animals ui 里边东西来做一个提示框就可以了，剩下的都是很细节东西，你说它难吗？它不难不难啊，它就是麻烦。嗯，那就是登录。我用一个 l 吧，看一下啊，哪个好用一点？那就用一下这个地方的一个 running arrow， arrow 也行。 行吧，那就用 iro。 好，我们来试一下，来回到我们项目里边，我这呢随便输啊，肯定是不对的。 好，这时候呢他提示一个信息，呃，说我们这些东西没有，因为它属于 animates 里边的哈，那我们需要给他做一个引入啊， 好，在这咱需要给它引入进来，这样呢，统一我们就写成 element， element element element plus， 好，再来。好，你看，这时候就提示了，对吧？那我们这样提示呢？就可以完全 全直接用什么？呃，直接用它原来那个提示就可以了，因为它的返回后端的返回里边是有的，我们可以看一下，比如说我这儿输入是不对的，大家可以看 r e s 的 matter 的 m s j 对不对？ i s 的 meta 的 m s d。 啊，这是一个提示好，比如说现在我输入是不对的，那这时候会提示我一个这么一个信息， ok， 好，那如果说我输入对的呢？啊，比如说我这儿输的是 m in， 一二三，走，好，稍息一下啊， 当然，如果说非等于我们就 return 啊，如果输入是对的，那我们要打印一下 i s， 当然还有很多小细节啊， at me， 一二三，走啊，这时候我们是登录对的，好，这 其实有一个 talking， 我们需要存储啊。呃，假如说我这样的输的就可能格式都不对啊，比如这样吧，那你你不能报错啊，你到这也可以提示一下啊， 提示个信息啊，输入请输入啊，正确格式。好，那这时候呢，我们就 看看，不用这个，用一个 warning 吧，用一个警告吧。好，那行，那我们先来看，如果说我输入了正确了，比如对了啊，那他会返回一个信息，对吧？开始。 好，那这个信息呢？这里边有一个 i s 点 date， 这儿有个 talking， 看到了吧？啊，也由于是说我们可以 r s 点 date 点， ok， 好，再来刷新， 既然对的哈，点登录。哎，你看，那这个东西我们要存到哪呢？我们要存到原来我们存到本人存储加 v o x 里边啊，就是这么一个内容，现在呢，我们存到 pina 中，好吧，就使用 pina， 也不是说存到 pina 中，就是我们使用 pina 呢来做这个管理啊，然后存到我们的 pina 那份内容。 好，所以说呢，下边呢，我们就来练习一下 piny 啊，我们之前讲过就一直没有用过了。好，下面呢，我们就先去安装一下 piny， 安装一下，然后呢，给大家也解释一个问题啊，很多小伙伴会有一个疑惑啊，就是我们的 talking 存到哪？首先呢，我们的 talking 一定会存到本地存储啊，就是 local storage， 为什么呢？是因为如果用户把这个网页旁关了，我下次再比如说关了以后出去吃点饭是吧？我再回来，你还让用户登录吗？就不登录啊，当然还有什么用户的这个 top 过期时间，我们先不讨论那个啊， 就说本地存储是为了做持发存储的，对不对啊？用户关了然后再进来，那么他就不需要再次进行登录了。好，那过去呢，我们还存到 view x 啊，就会随便写啊， view x 中，为什么呢？ 可以我再说一遍啊，可以不存到它里边，存到这个里边呢，只是方便项目中使用。我说的是只是方便使用。好吧，那有些小伙伴说我直接用 local story 这点儿 get it 或许就可以了，对不对？ 是的，可以，但是 local story 点 get 什么东西？这个太长了。如果说我直接一个 talking 啊，比如说什么 story talking 可能更方便一点，也就意思说他不是必须的。好吧，他不是必须的，但是我们都会这么做啊，他俩是家的关系好不好，这一点一定要切记哈。行，那下面呢，我们就回到这个下面里边啊，我重启一下，然后呢，我在我的目 目录要新建一个 storm 目录啊， s r c 有个 store， 这儿呢，新建一个 index 点 g s。 好，呃，然后呢，回到我们 mate g s 中，需要 inpult 一下这个 store， 这儿有一个 from， 然后这儿是一个点杠啊， store ok， 然后 us 一下。 好，那我们的 store 里边所写的东西呢，就是要引入 pnea 好，在这呢我们就引入了 pena。 ok， 那我们要分模块的话呢，就需要新建一个 user 点 g s 啊，这是关于我们用户的各种行为啊，比如说用户登录完事以后呢，它它的 talking 是吧？那么把这块整体拿过来啊，整体拿过来， 那首先呢，这地方有个 talking 啊，这儿是设置 talking 啊，然后这个地方呢是开启我们的数据缓存的啊，当然把这个先注了啊，后面可能会有用，到时候你再说好吧。呃，然后呢，我们这里边呢， 还需要下载一下这个持久化存储啊，把持久化存储下载一下，要不然就报错了。好，然后呢，我们再来看这儿，我的 k 呢叫小路线下滑线， you sir 啊，行，好， 那么现在呢，到我们的这个捞针点六中，我是不是应该要调用他了，调用拼价东西了对不对？那下面呢，我们就要调用了哈，那在这呢，我也有写哎，我把写那东西给删了啊，那大家就看到我这个可以去做了那，呃怎么样去 引入呢？大家还记得吧啊，如果大家不记得话呢，可以在咱们这个项目中去搜 pin 是吧？哎，然后呢，去看怎么分模块 啊，这呢都有洗啊。呃，然后在组件中使用，是不是我们可以直接，因为我们这不需要什么 store， 点 two i f s 啊，进行结构啊，所以说我们这可以直接拿过来用，这是我们的 pinion。 呃，这儿有个 user， 那我们看一下那个名称是不是叫 user 啊？叫 use user store， 那所以说这儿的名肯定要改一下了，这儿也要改一下，那这叫 user store。 好，那就可以直接用了啊，那我们就，嗯，在下面直接用就行了，在这儿啊， set talking， 然后把这个传过去。好，那我们在这儿可以直接打 talking， 直接打这 user store。 第二， talking。 好，先说一下 site talking 哪来的啊？ site talking 是我们这儿写的一个 site talking 啊，知道了吧？啊，然后呢，这儿有一个 state， 有个数据 talking， 所以说我在这可以直接读好了，我们来看一下能不能读到啊。 嗯，进入到我们的 login， 别报错了。好，然后我 per 一点，哎，获取到了，来看一下我们的应用的存储里边是不是有一个 top， 哎，这样我们就存上，所以说我们在这呢，就是这个账号密码登录啊，就没有问题了。当然登录完事有一些行为啊，比如登录完事以后，我们要回到之前那个页面， 对吧？比如说回到首页，这个呢，我们后面再做，好吧，就先，目前就是我们的账号密码登录这块就没问题了。好，这样呢，我们总结一下啊， 首先布局就不说了啊，然后呢，这样的内容，这样内容我们的前端要做第一步。是呢，就是先要针对于用户名和密码进行一个验证，这是前端验证，跟后端没有关系 啊，然后等你验证通过了，那我们这呢要发送一个请求啊，就是后端给您接口，对吧？发送一个请求，那我们要把这用户输入内容呢进行加密啊，然后呢，等后端有返回的结果呢？我们需要给他存到返现随手或者 vs 中啊，这种整个过程也就说 说，第一步，我们先前端自己啊，自己去验证，叫叫验，先验证一遍好。然后第二步呢，请求，请求的过程呢，我们需要干嘛？ 加密对不对？要加密好，然后返回的数据要干嘛？要存起来，存哪呢？存到我们家通俗点啊，存到拼价中，对吧？那其实呢，就是本地存储 也做了，哎，就这意思啊，那么至于登录完事以后的行为就是第四步，第五步了，这个后面我们再说啊，先把登录这块都给做了，比如说短信，这还没有做呢，是吧？行，短信这个呢，我们就放到下一课啊，那这一课内容我们就先说到这里。
153小鹿线-北京线下班
02:24查看AI文稿AI文稿各位小伙伴欢迎来到我们的第三章节哈，六三通关系列，今天我们来讲一下 two r e f， 我们 two r e f 的作用其实就是将我们的 rector 代理的数据，把它的中的属性变成我们的 r e f。 首先我们来打开看一下， look 一下， 打一下我们的内幕，这个就会变成一个 r e f， 来到我们浏览器运行一下， 我们来检查一下，检查时候这里会得到一个 object， r e f 这样的数据类型。首先这个下颚线 r e f 表示已点没有拿到值，这个 k 就是你代理的那一个属性。 object 是他的原有的那个对象啊，原有的那个对象，这个表示 默认值是没有的昂，立法刚开始没有值，那么这里拿到的就是我们这一个来拿到的就是我们这个数据，看到没 recture rectube。 那么紧接着来到我们的代码， 代码，我们这个 tourf torf 它是怎么做的呢？第一步，首先它返回的是个实名对象，对不对？刚刚打印看了，那么 torf 它是个方法，它返回首先是个方法，返回实名对象，来到我们自己实现的这个圆码来看一下。 首先我们这个 two r e f 传一个我们要代理的，将我们的目标对象的属性代理成 r e f， 它返回的时间，时间对象那就是个内在，里面有几个属性， 有几个属性之后其实本质就是什么？就是一个代理，就是通过我们的内容的 get 和四大方法，当你获取值的时候干什么拿到这个 rector 中的属性，这个 rector 就 那个对象，它里面是不是显示的数据，把它拿到这个数据就是显示的，当你干什么，当你设置值的时候干什么？对他的值进行修改，这个就是他本质 tour 也否非常的简单，就是 将我们对象中的啊，就是我们的通过 reactor 代理的显示数据中的属性变成 r f， 它的底层代码就是 class， 通过 class 你们的 get 和方法， get 和 set 方法来进行代理，当你获取的时候通过 get， 当你设置的时候通过 set， 那么基层代码。刚刚带同学们也看了哈 r f， 我们这个 two r f 是非常简单的，看这个就是我们的 two r f 的基层代码，基层代码就是本质就是一个代理。
21前端悟空
07:51查看AI文稿AI文稿好，这一课呢主要讲内容呢，就是基于 wait 这样的构建工具，在 v u 三的项目中呢，如何去设置代理来解决跨议问题？然后呢咱再顺带角的把 excel 四二次封装以及 a p i 解五呢，都给它顺带一下哈啊，毕竟 excel 四二次封装呢，美公司可能针对于他们需求呢，封装不一样啊，我们这呢就稍微带一下就得。 好，那首先呢，咱们先说第一个事情啊，就是来设置一个代理，那在 wit 中呢，设置代理是比较简单的，我们可以看一下这的一些内容啊，这是我写过的一个文章啊，首先呢我们要找到 wit 点 config 点 g s 这个文件啊，那我把这个参考文章也给大家放到这，这是一个设置代理 啊，解决这个跨域问题，那在公司里边呢，肯定是你要做这个代理，甚至还要做什么这个环境变料，然后以及 xs 工装是肯定的，对吧？ api 结果这些东西是必须的啊，然后这呢就给大家 弄一个参考文章吧。好，那下面呢，我们就按照参考文章呢去设置啊，来，我这样的设置可能是比较简单的，我们就直接去用就行了。那你公司里边呢，可能每一个 api 都不同，对吧？不是，可能是肯定不同的 啊，然后呢，在这呢，你把那个 api 呢给他添加到这就可以了啊，对应的这个网址啊，或者是 ip 啊，那我这添加的是咱们这个学习路线点私人这个网址哈。行，那这样的话就 ok 了，我然后我们把项目呢给大家重启一下，启动完事以后呢，我还会做 xs 二分钟，对吧？那这样呢，我们就新建一个目录啊，是一个工具类。 好在这个工具类里边呢，我新建一个 requested g s 啊。啊，这里边呢就是有关于 x s 二次封装的内容，那我就把这呢整体给拿过来了，那在这呢我强调一下，就是在 v o 三里边呢，它除了新增的什么乱七八糟那 东西啊，那 xs 这块或者 api 这块啊，他并没有一些东西，因为 xs 不是属于 vivo 的，对吧？啊，就是说你在这个上面里边可以去用，你在任何地方都可以用 xs 啊，所以说呢，他没有任何的改变哈，这点大家要切记啊，就是很多小伙伴会问到这一点啊。行，我就把 xs 给他下载一下。 好，下载完以后呢，我们重启一下，那他先下。哎，下载完了哈，那我们这就直接说吧， inpuls， 这不用说对吧？这是创建一个 excel 对象，然后这是一个请求拦截器，我这也没有做一些功能啊，就是大体的一个东西，这是一个架子啊， 然后这是一个响应的拦截器啊，然后你这样呢可能会判断很多的扣的码，那你就自己填就好了，好吧，然后这呢是 response data 啊，返回的一些我们的数据啊，当然你可以按照你的需求 data 点 data 啊，只不过我这样呢是点 data。 好，那么现在呢我们这样呢就，呃把它分装完了，分装完以后呢，在很多公司 里边呢，都会单独再弄 a p m 键，是吧？然后这里边是封装的一些呃，这个请求的具体的东西啊。好，那我这呢随便给大家打开一个接口文档吧，当然我也会添加到我们的课程里边啊，大家到时候直接在课程里边看，在这我给大家演示一下啊。稍等。 呃，我找到咱们这门 real 三的项目啊，在这呢会有一个接口文档，到时候大家点进去就好了啊，我这还没有给大家添加哈。呃，然后呢，我这就随便去找一个测试的就行了，比如说我就拿一个 轮播图吧，好吧，拿这个轮播图吧，因为毕竟他有很多图片啊，然后呢，在这我就新建一个 g s 文件啊， 好，那这就是一个轮播图的一些内容啊，然后把这个整体代码给他拿进去。好，那， 呃，他这个请求的一个 ip 啊，一 api 啊，我给放到这儿啊，然后他的请求方式呢是一个 get， 所以说我们这儿呢就都不需要了，参数什么都不需要啊，然后我把这名换一下， 行，那这样的一下这样的 api 解偶呢，我们就弄完了，然后现在呢，随便的去找一个页面进行一个请求吧。呃，我看一下，在这呢有一个 vivos， 那我就在这个页面吧。啊，咱们跑一下这个网页啊，在这。好， 那你可以通过选项是 a p i 或者 set up 这样去写啊，那我们就直接 set up 了，然后我们要引入的就是这个啊，然后这儿有一个 from， 找到这个路径，第二个要出去，然后是 a p i 下边的。 好，那我们请求的话呢，你可以在很多很多地方，比如说，呃，你是数据一开始要有的，你可以 在 b four 啊， on before mont 里边啊，如果说你是要靠这个第三个插件的，你可以写到 on monty 这里边啊，这个看你具体需求了，那这个呢，就等同于我们在 view 二的时候用那个 before creat 啊，差不多这样的一个内容啊，就是我们到还没有的时候啊， 行，那我们就在这里边去请求吧。啊，那我们先去拿到这个数据啊， is， 好，我们看一眼， 好，在我的控制台里边啊，大家可以看到这里已经有数据，对吧？ i s 点 date 点 list 嘛？ i s 点儿这个 date 点 list 啊，这就是我们的数据啊，一共有六项。行吧，那我们现在就把它选到页面上喽，那这儿来一个 u l l i， 那这里边我就放一个图片儿。 好吧，然后这呢，我们就写一个 steal， 呃，然后这有个 sql 的，那语言我就不写了啊，什么烂萨斯，我就不写了，挺烦的那个版本。然后宽度呢，就百分百，高度呢，咱们就来个二百吧，也别太大了。好，然后这呢，我们就给一会给他写上一个 item， 点什么什么玩意就行了。 行，我现在给他来一个微账号啊，循环一下 item in 一个 list 啊，那我们这呢需要弄一个数据，那这有一个 list， 等于 if 的一个数组。好，然后呢，在这呢给他做一个复值，他的 y 六啊，就等于这个值。 好，那么现在呢，我们这儿呢就可以写 k 了，等于 item 的 id， 是吧？然后这儿呢，就是 items 的什么什么玩意儿？好，我们看一下啊，来，看一下我们这个控台里边儿那个 图片路径是哪个啊？我们找一下啊，这样他有个错误，我先把这个先干掉。 好，此时此刻呢，我们的 l i 肯定会循环很多的。好，我们先看一下我们这儿的这个数据，呃，是 image 幺 l， ok， 那我就直接放到这儿吧。好，那这样的数据呢它就肯定出来了啊，一共有这么几张。 行，那这就是我们这儿呢做的具体的内容。那这儿呢给大家复盘一下啊，总结一下，首先呢我们第一步啊，在这儿呢写了一个 server 是吧？然后呢，这儿有 probacy 啊，设置了一个 a p i， 这是我们的代理。好，那设置完以后呢，我的 a p i 我在这儿呢就可以直接去写了。那当然，这儿呢我们有一个 x s s 工装啊，然后这儿呢会 呃有一个请求拦截器以及响应拦截器啊，那请求拦截器，响应拦截器，这个我就不想了啊，因为，呃，还是那句话，我们课程是从二过渡到没有三啊，必须要二，特别是 游戏啊。行，那在二里边呢，肯定我们要做这个 xss 封装吗？只不过我这就搭了个架，请求和响应来电器里边什么东西都没判断啊。行，然后呢，我们现在再到我的某一个呃文件里边去进行我的请求的接口的这些东西，比如 ul 是吧，可能有参数，你就把它写呗，是吧，没有参数就算了，或者请求方式。 然后呢，在具体的每某一个吧点 vivo 文件里边啊，我们 input， 然后在某一个生命周期里边直接去调用它就可以了。 那么大家可以看出来啊，就是基本上和我们二没有任何变化，对吧？所以说呢，就是请求这一块呢，就还好啊，没有给我们带来太多的一些学习的成本啊。 呃，然后呢，值得说的就是，呃，在这呢大家可以对照着他一些生命周期钩子啊，正常使用，比如说我们要在数据，呃，就是盗墓之前你要用 before mont 是吧？然后你如果要借助了啊，举个例子吧，比如 是吧，你肯定要写到 on monty 的这个生命周期里边啊，所以说呢，你要选对这个生命周期，然后呢，这样呢，有一个 a p i 的参考链接，我也给大家放到这儿吧，省的大家去找哈。 行了，那么有关于师师代理什么乱七八糟这些问题啊，那这节课呢，就先说这么多。
82小爽AI产品经理
18:14查看AI文稿AI文稿hello， 各位小伙伴啊，最近呢，我要录制一个 vivo 三的视频教程了啊，有兴趣的小伙伴呢可以一起去学习一下啊。那首先这样的，之前呢，有些小伙伴会问到，我说，诶， vivo 三都这么长时间了，你怎么看是吧？是怎么看的问题啊？怎么看这个 vivo 三，一会呢我给大家去聊一聊。然后其次呢就是 vivo 三的一个使用吧啊，使用，那我后面会给大家讲 vivo 三的各种大使用。然后呢再其次呢就是公司怎么用，公司怎么用， 因为有三个产生来说，呃，有很多东西他是比较乱的，所以说呢，有的公司呢，使用方式可能都是不同的，比如说百分之八十公司这么去用，但是有百分之五的公司那么去用，百分之十的公司呢那么去用，那我这呢需要呃通过这么几个情况给大家讲一下分别不同的用法。好吧，那这随着我们课程呢慢慢就会更新下去啊。 行，那先来说怎么去看的这个问题吧，那版本的升级，首先 biu 三呢，肯定是从 biu 二升级到 biu 三，对吧？他有一个升级的过程啊，那么升级来说呢，我之前看到一个学员说过一丈话啊，就是换汤不换药，我特别赞同这句话，大家如果觉得说一个东西他升级了，改动非常非常大，大到硬境界了，那这个产品也基本 什么意思呢？就拿举个例子吧，比如说王者荣耀啊，这样游戏来说，他是一个推塔游戏对吧？不是一个人的王者，是团队荣耀对吧？推塔一个游戏好，如果有天砰一旦升级变成一个可能合格制游戏，或者变成了一个什么呃，射击的游戏等等乱七八糟游戏，那这个产品内法又和之然不一样了， 等等等等，使用的人肯定就会下降，大幅下降。所以说呢， vivo 二升到 vivo 三呢，大家不用慌啊，就是他就改这么一点东西吧，差别呢，并不特别大，也就是你会 vivo 二升到 vivo 三，很轻松的就可以过渡，只不过有些东西呢，我们人可能也会有固有思维啊， vivo 玩挺好，突然弄个 vivo 三，我觉得这不好那不好，是我们的固有思维啊，当然也确实需要我们的分辨能力 啊。然后呢，再说一下，就是 vivo 三，啪刚一出来时候，很多的小伙伴啊，都会觉得好牛化层啊，全都一猛子都去学了。好，你要注意啊，就是一定要有自己的分辨能力啊， vivo 三，咱们假设一个情况， vivo 三都出来了，然后挨了问 t u i， 他没有升到三，也说你用 view 三项目去以外 mpv 做掉，你觉得是不是有必要？你觉得你的相声有必要，完全没必要，对吧？所以说呢，这个 东西他只个升级，并不代表说他很强，对吧？他可能是未来呃，绝对会替代二的版本，这个我们不能确定啊，但是如果要有再出了 vivo， 那 vivo 基本上可能就不降，我们一定要有突破固有思维的思想，就是我们一定要有接触新鲜事物的能力，或者说接触新鲜事物的能力，或者说接触新鲜事物，我们要勇于去接受啊，但是也要分辨出来，不是说一个新东西 polo 数量就一猛去学啊，弹出来讲，这东西被炒的最多的就培训机构， 所以说呢，大家一定要有分辨能力啊，然后其次呢就是大家可能在网上也看过，比如说这个 vita 加 vivo 三，甚至还有加什么 gucci 四是吧，甚至还有加什么啊，平亚还有加什么 that， 还有加各种各样东西，乱七八糟啊，甚至还有这三大加一大堆， 这家到底是啥是吧？我分别给大家去说，这就是我告诉大家的，刚才说到他好乱啊，咱们一点聊好吧，一点聊我就当大家呢这些东西都不知道一点聊，那我六三，呃，怎么看呢？就是他目前来说吧，或者 vivo 本身吧，肯定是做后台管理系统非常适合的，做前台内容还是不适合的，然后随着这个课程大家慢慢去体验 vivo 三吧，或者体会 vivo 三的优缺点就可以了，那至于他怎么 去使用呢？这个随着课程咱慢慢去聊啊，我就一步给大家去说，包括那些东西啊，位置啊，加什么东西，对吧，慢慢的去聊好吧啊，然后公司怎么需要呢？就是后面等等都会的括号。但是呢，我这先要强调一点啊，就是，呃，我这次呢会讲的 vivo 三，主要是拿 vivo 和 vivo 三进行对比，如果一些小伙伴呢，没有学过 vivo 二啊，我建议呢就是你去学一下我的 vivor， 或者说学别人 vivor 都是可以的啊，无所谓啊， 大家要学我的 vr 呢，可以到这个学习路线展森或者小路线展森这个网站，然后这呢有课程的全能框架，然后在这有一个 vivo 基础课，大家可以学这个。好吧，那我就不在这呢不多说这个 vr 东西了，我只说这个对比，好吧，如果说你真的不会 vr， 一定要看 vr 再看这个，要不然你别看好吧，因为这里面都看不懂，你也看的费劲是吧，彼此都难受。好，那下面呢，我就呃正式的去来说微商的一些东西啊， 来写一个 bg， 我就当他家的这个 vivo ok 的 vivo 三什么都不会是吧他其实呢，我也当他不会了，我就整个都给他过一遍啊要首先呢，今天第一节课的第一个事，我们就来创建 view 三项目呗。啊，创建项创建 view 三项目创建 view 三项 上面呢有很多形式啊，很多形式，比如说我们经常一个命令就是 view， 呃， creature 这这个项目名称是吧，这么去创建，来吧，我把 view 二和 view 三都给创建出来啊，我进入到我的桌面儿，然后 see view creature 代号二就是 view 二啊，我再提一个 viv crate demo 三，那就是 vivo 三了。好，我先把 vivo 二这个版本选一下，我就把 return 和 vivo x 都安了啊，然后这样选择，看到二点叉走你。哎，我就按个二，那就二吧，就按个二，好，就按个二，然后这个玩意呢，我按个三，千万别点错了，三点叉啊走。好嘞， 好，他们先按着，然后呢，哥几个去聊着是吧，咱先喝着。好，就是。呃，我们通过这样的形式呢去创建这个项目啊，注意，这个形式是基于的构架工具。什么基于 构建工具？工具？嘿，是这个 wipe 啊，注意，这样积极构建工具是 wipe。 然后刚才呢，我给大家说过一个东西，就是 wait 加 vivo 三，看到吗？ 就不是基于外派。好，我们先来说一下，可能大家在六二章中已经做过很多项目了，那基外派这项项目呢，有一些痛点，怎么样痛点呢？大家看这个图啊，先说一个痛点啊，就是如果我们做这个项目，这个项目呢，可能有一百个组件，或者一百个点背文件 好，然后呢？某一个点没有文件呢？修改了点东西是吧？这个点东西啊，至于哪点咱就不说了啊，修改点东西，然后我帮你保存，我一保存时候呢，我去刷页面，我靠，怎么还跟原来一模一样，然后我一看这终端，我靠，你还没修完呢啊？你等半天，等上个十秒五秒都有可能。 大家发现一个问题，没有慢是吧？ wifi 好慢好慢，为什么呢？看这儿啊，是因为这样的啊，这个 wipic 呢，它有一个摁水，就是入口， 如果大家足够了解到 cat 的话，它有 encher 和 output， 是吧？入口，咱们拿入口来说，我这项目呢，可能有很多的页面啊，就是很多的这个 ruce 啊， ruce 这个路由，比如有三个吧，咱们举举个例子啊，有三个，当我去修改某一个时候，比如我改这个，我改这个和这个点没有文件，和这个没有文件，这俩页面有啥关系呢？ 我改，我和你俩啥关系呢？没关系，但是我要派克也会把他们重新的编译解析一下，然后包括他里边一带项全部再执行一遍啊，最后完事啊，我，我只说开发环境的时候啊， 这就是来拍个问题，导致你开发效率比较慢啊，就是我改一个，当组件特别多，改一个时候，其他都得编一下，超级慢。好，那么 有没有很好方式呢？ which 啊，这是这节课要说的这东西呢，大家一看图就明白啊，比如说我这也是有 n 多个这样的页面或者组件，不管啊，当我去改某一个，比如改这一个吧，哎，只是他自己生效，这几个哥们呢？不生效 啊，不就是说，呃，不根据啊，这呢进行什么加载呀，各类各样的东西啊，他不需要重新加载啊，这就大大提升效率。大家想想，我有五十个好假，五十都执行，但是我只改了某一个，那一个执行不就好了吗？所以说呢， wait 很好，那我们总结一下，呃，基于 ipad 的项目， 这项目啊，有一个问题啊，就是开发 map， 或者叫编译 map， 编译啊，编译版来解决它，该怎么去解决呢啊？使用 wait 构建构这个 wait 构建工具，使用它 使用解决，就是使用位置啊，就可以了，位置呢，要比他快，所以说呢，咱们要了解位置优势， 在开发，我只说在开发啊，在开发过程中大大提升我们的效率， 大家形容交流。好，那现在我再给大家阐述一遍啊，就是大家去创建一个 view 的项目，你可以通过战士创建，你也可以通过一会我讲 wave 方式去创建，这两东西呢，都可以完成你的项目，这个我说清楚了啊， 都可以完成一项，但是如果单纯的通过开发效率来讲的话啊，一个保存大码代码来讲的话， wait 要比 rap 速度要快，一会我带你带大家去体验。好吧，所以说呢，两个无所谓，爱用哪个用哪个，但是这个东西快，我们就用快的，舒服的，爽的，对吧？我们出出去就坐飞机，就坐高铁，就开车，我不骑。那那个什么，这，这个大轮车是吧？不，不，骑大轮车，不，不，踩平衡车，哎，就舒服， ok， 就跑车各种要开，哎，就这意思啊，就是我们要选一个跑的比较快的。好，那么 vit 项目怎么创建呢？创建 vivo 三项目，我们要基于 which 这构建工具。 命令这样的，跟它这儿就不一样了，命令这样， n p m 啊， in it， 然后这儿呢是 wait 哎， wait g s 哎，然后这是项目名称， 好，我再来一个，进入到我的桌面，然后 n p m e net， 啊，我们这儿呢，起一个名称，先写一下 wait g s 我叫它 wait demo 吧。好吧，随便儿起一个。 好，然后他让你选择你要创建什么样项目呢？那肯定 view 呗，选择 view 啊，走啊，然后是 view 的还是 view t s 的，呃，咱们先不说 t s 啊，如果小伙伴会呢，你就随便。好吧，不会呢，就 先跟着我走，选 v 五吧，走好，然后 c d 根据它的命令啊，进入到我们的目录里边，然后 n p m。 算了，我要 c n p m 安装它依赖，然后 n p m 绕 d v 启动起来啊，就可以了， 咱填不上第一位啊。行，好，我们来体验一下它的效率有多么的快啊。来，当然现在呢，还不是体验那么特别特别深刻啊。我们打开这个 logo， hose 三千， 呃，他访的时候扣后三千，大家看到了哈，来，我随便去改个东西，我打开这样的一个 app 没有吧，或者打开这个 hello 啊，都行啊，无所谓，就打开这好，我在这呢写一个一二三啊，我啪一保存，你看 是吧。四五六啪一保存，你看这速度是吧。叉叉啪一保存，你看这速度特别快，所以说呢这个东西呢只是提升我们的开发效率罢了而已啊，那就是你的一些选择了啊，到底你要用哪个倒无所谓好，但是呢大家呃 这样呢，我要给大家讲就是这个东西我不知道说了大家应该会对吧，这个就直接写代码就好了。那这个呢还有点问题啊啊基于 wait 呢还有点问题啊。首先呢 wait 呢它默认安装的如果你选择是 view 的项目啊它默认安装的这个版本呢是三的 view 三 啊默认是 vivo 三的啊。所以说我们这也记录一下如果选择 vivo 的项目默认版本是 vivo 三是 vivo 三。好，那 vivo 二能不能用呢？能一会我给大家讲啊。但是呢我们先来先来看一下这个 gv 的这个项目录啊 s r c 大家熟吗？不熟吧，熟是熟，感觉少点东西对吧。少什么呢？原来我们的那个撸件没有 store 没有。那咋办？这有啊啊，你把他的 src 整个的给他把这个位置的啊 src 给他删掉，把这 src 呢整个复制粘贴过来就可以了把这儿一复制 把这一复制把这一粘贴就可以。哎我这个粘贴的咋这么慢哎这是我电脑问题。好吧那那这样我我自己新建一下。这是我电脑问题啊各位你们肯定是不需要我这么去操作的这是我电脑问题我需要手动移一个来。那这个电脑 不听我话了已经好久已经坚持了很很久很久啊，我就一个一个笨点啊给它新鲜出来啊啊就是你要做的话呢就把你那个呃 s r c 粘删掉啊整个的复粘贴过来就可以了。好，我们就我这操作笨一点吧。 好，我把这个都拿过来。 好，这第一步还没有完呢哈，各位，呃，第二步呢？是你再打开你这个用 create 创建的 vivo 三项目的拍点 jason 啊，把 这一块，把这一块复制一下啊。哎，搁到这，搁到这个位位置，这个地方，把力量效应给按一下，好吧，来， n p m i。 然后呢，你再去启动啊，可能也会报些错，然后改一点东西就没有问题了。 好， n p m 状 b v。 走，启动起来。好，启动起来以后呢，我们看啊，它里边其实已经爆了一些错了，比如他说圈儿也不认识，对吧？咱们需要去改一下，找到这儿的一个，呃， home， 把这改成第二杠， 他们还会报一个错误啊，这个错误呢，我直接给大家去找吧，就是这个 ruth 里边这样呢，没有那个点 env 文件啊，所以说我们改天告就可以了。大家看，这不是我们熟悉的那个 vivo 的初始化的项目吗？哎，这也没有问题，好，给大家总结一下。呃，如果说我们要用 wat 即 wat 的来做项目的话啊，那我们要做的事情， 六三啊，六三使用。呃，这个应该不叫六三，应该叫 wait 加六三的方式。我们第一步， 把 print 创建六三的 src， 整个复制粘贴到 基于 wait 的项目中啊，只敢我们做第一步。第二步，把 create 创建的 六呃，把根的创建的 package jason 中的。我得给大家看看啊，这，这块， 这块，复制粘贴到这条 在项目中啊。第三步， n p m r。 呃， n p m i。 安装依赖啊。第四步， 启动修改错误就可以了。刚才我不是改了一个那个第二缸路径吗？还有一个是 rooter 里边对吧。改一个这个啊就可以了。那有些小伙伴可能还会有一些需求说，哎，我觉得挺好用的，对吧，这个东西挺好用，那我的 viewr 的项目呢， 也想用这个，我不想记 wifi 了，哎，那能不能用呢？可以啊，那可以。好，我们下面就来说一下 vr 的该怎么用。那 vr 呢，是在戴帽二对吧？好，那也是一样，前两步没什么区别啊。你要把它的 src 这块 给它放过来啊放到放到这边啊放到这边啊。那我又把 s r c 给删掉了，我这复制是有问题的啊，我再确定一下大概是不是 m 二啊 啊 ok， 好，复制我这个复制大家可别学我这种复制啊。我这我这是我电脑问题啊，你也别别到时候按照我本身你的电脑是可以的，结果按照我这样去去弄了。 这一句话不到位，我怕大家也笑话这麻烦大。是我电脑问题， ok， 然后这个里边就一个 logo 好行，完事以后呢也是把它那个拍着 jason 的，因为你是基于哎 the demo 二啊，这个啊，你看它是基于 view 的版本是二点六对吧？二点六点十一啊，所以说把这块也是要拿过去， 然后到这也是改一下再重新下载那个依赖啊，你看现在 vivo 的版本是二了对不对？不是三了再重新下载依赖。 p m i。 好，等下来以后呢， n p m 让 d v 去启动启动完事以后呢，就会报很多很多错儿了啊会报很多很多错呃，首先呢它报 d 个错呢，就是找不到这个玩意儿啊，找不到这个东西，那我们就需要把这个东西呢按一下啊， c n p m i 按一下。 好，我把这个给大家记录一下。第一步，第二步啊第二步，我们拷贝过来的是这一大堆 好，第三， 呃，第三是，对，这还有一个是复制安装依赖， 注意会报错，再安装一下这个啊，完事以后呢？哎，还没完事呢，等他完事以后我们再启动一下。啊 呀，这么慢啊， 呵呵，这还有点慢，行，他先安置吧，然后我给他去找一个插电啊，因为一会呢启动起来他还是不行的啊，还会有一个问题啊，所以说我们要用这个 wait 关闭原一会呢要用到这个玩意啊，我们去 n p m 去找一下啊，你要去下载一个这个玩意啊，然后呢在那个 wet ctrl ps 中的新配置啊，这样才可以。这还没安装完，行吧，没有安装完的话呢，我们就先按它去吧，周围要是慢啊，咱们先安装它，那我们就把这个删掉吧。第四步第五步 再 page page。 东西如下，比较简单啊，我我们直接来啊，直接来到这好，大家看啊，第一行这个地方把它拿到 我们的这款，这款就不要了啊，一会我给大家整个的 project 过来啊，这样就不要了，就看这个 好，然后呢这个底部也是一样整个换成它啊，直接都换成这样就可以了啊，这是最后我换完的。 呃，当然这一块儿的 defunt cray defunct convey 这个也算先留到这好我们再启动一下啊，可能会还是爆那个模块啊，我们需要把模块按一下 行，那再再运行一个第六步是吧，再运行好再去启动。 哎，现在就启动起来了啊，启动起来了，行，我们去看一下 logo home 三千，当然还会报一个错啊，就是你那个路径问题啊，路径问题呃， james view 是里边的 home， 这跟第二杠， 然后还有一个问题呢，是你那个，呃， rucher， 呃，这地方我们改天去杠， 小心，哎，还是有问题，看一下。嗯，没问题的。好，我再重启一下吧。 好，我们再重启一下，再看一眼啊，哎，大家看是不是现在就 ok 了，这是 vivo 二啊，大家看切换，哎，都是没有问题的啊。那这一课呢，就主要给大家说一下，呃，这个 wait 加 vivo 三，它到底是怎么回事 啊？然后大家呢，就可以后面我讲课也是会用 wait， 基于 wait 的，一个没有三项啊。然后大家呢，也可以按照你的自身情况是吧？你公司里边呀，或者说你自己想用哪个都是可以的，用 wifi 也行，只用位置也行，只是让大家清楚的 有一些地方的课是这样的，那么到底这个是啥啊？要给大家说清楚。好，那这节课呢，我们就先说这么多，然后下节课呢，咱们再具体的说。 view 三里面都强。好，那么构建创建 view 三项目我们就先说到这里。
126小爽AI产品经理
05:07查看AI文稿AI文稿各位选好，下面我们给大家安装一个 regis 的相关调试插件，有了这个插件之后，我们可以方便我们调试代码， 也可以查看 music 的一些数据，都可以通过可视化的界面进行操作。也就等一下我们安装一个插件，安装插件之后，在这个地方会多出一个六，但这里我关闭了窗户，我重新打开单键键检查， 就在这里面会多出个 view， 到时候单独的一个 view 插件呢就出来，我们可以通过这个插件来查看它里面的相关的属性方法，然后一些计算属性呢等等监听器啊都可以查看到，并且它的一个组件的结构都可以查看。但这个插件我提供的是关于谷歌的插件， 我们在课程当中也建议大家呢使用谷歌浏览器，因为这一块我们程序员一般都使用它来进调试，而且市面上一般现在慢慢使用的都是 骨骼浏览器，所以我们在这一块呢提供了一个插件，这个插件我在开发工具当中给大家提供了，就在开发工具里收到的零三里面，零三当中有这个，那怎么安装呢？如果你之前已经安装过这个地方就忽略， 好吧，那我们在这块打开一下，这里有一个 view 的插件，他的一个开发插件，为了更加方便的审查和调试 view 的项目，那首先我们要打开一下开发的模式， 开发的模式你可以直接在浏览器里面输这个地址就行了，直接输这个地址或者是在这里面应该是会有，我们点击一下，我们在这个看一下 这里更多工具，这里有一个扩展程序，扩展程序我点击，然后在这一块他开发的模式我没有开启，然后点击一下，点击一下开启，注意第一步进来之后，这地方先开启他那开启的 这这个地方才有这个效果。有了这块字，我们要将那一个呢插件呢把它拖过来，怎么拖？就按住他，就按住这个插件，然后我们在这一块来一下，将这一块呢给他拖到这里，拖到这里我们稍等一下，拖到这里你可以看到他提示，如果这一块提示呢，我们点击一下添加， 在这里可以看到在这面提示就不用管它，点击一下关闭，然后我们在这一块把这一个呢把它打开一下，把它打开一下，好吧？把它打开，我当天采用的是六点五的，就这一个插件，有了这一块对应的，我们再回到这里面， 这地方我们刷新刷新这一块，没有，对吧？没有。我们把浏览器把它关闭一下，然后呢我们再打开一下，我们这个项目，注意你要看到那一个六，我们先在这先演示吗？先正常的效果给大家演示单旧键，这里来 open 就打开，那这一次我们看一下他会不会默认打开浏览器 打开了，如果他没有打开，还是那样子，看一下右下角这个端口号，你自己手输这个地址，手输这个地址，然后呢这一块进来，进来之后我们在这单旧键检查检查，然后在这一块我们看一下，这里应该会有点击一下这里有个 view， 有个 view， 看到吧？那我当前这一块采用的版本号，然后这里面跟元素， 然后呢在这个其实他就是一个默认，就是一个跟组件，这应该叫跟组件。然后呢在这块你可以看到我们声明的就对的一个对的选项对不对？对的选项里里面有个 message， 你可以在这边点击这一个笔，点击直接改，改了之后他会同步的更新， 就相当于我们修改结实代码，没有结实的代码修改了之后点击这个保存，你可以看到这里就更新了，可以直接在这一块改，到时候现在你可能看出来没什么用，但是如果说你的组件多了这个层次结构，他就会有哪个是 组建呢？组建我们后面会讲，好吧，但是有些东西安装之后可能发现并没有这个 view 很大可能性是什么？很大可能性他是这样子的，怎么样子？按旧键，他选择的这一个就在这块默认浏览器或者是其他浏览器，这个默认浏览器就相当于 访问了你本地的磁盘，就访问了我这个文件，在这一块默认答案，我的默认浏览器当前是这个了，当前是这个浏览器，不用管我把这个浏览器关闭掉，就这样子，如果默认浏览器在这个，我们就选这个，比如说我这里单就件文件资源。哦，我当前浏览器是这个，那我就改一下吧， 改一下选择其他，然后改这个始终使用他来先打开看下会不会改，改回去了，那 ok， 现在出来，出来这里可以看到我这个是第一盘，这盘浮的方式进行访问，对不对？第一盘，然后这个就是以地址，他是以 服务的方式进访问，那我们看一下这个以底盘的方式看一下有没有检查，然后在这一块你可以看到这个地方并没有，没有，并没有，没有，所以说要以服务的方式访问才行好吗？要以服务，但实际上这个插件 你不习惯用的话，实际上你也可以不用，你可以通过这种 con solo 的方式，就在这个 con solo 的方式进行打印，日志可以查看。如果实在装不上去，就 不要去纠结他了，不要去纠结他，因为有一些可能是一些版本不兼容，会导致你在这块安装失败，只要你安装好了，安装好了，你在这块要在这里面更多工具，任务管理器，但是不这里来更多工具，应该是扩展程序，扩展程序你可以看到这个地方要打开，安装之前你记得这里打开一下就行，直接拖过来 就按住他，拖到这一个窗口就行了。那这样子他提示了之后你直接安装就行，到时候注意再强调以服务的方式启动才行。你这种方式吃饭的方式直接访问，这个是不行的，他解析不出来好吗？这节课我们讲解到这里，谢谢大家。
21梦学谷
05:40查看AI文稿AI文稿好，这节课开始呢，我们就来说一下关于组建上的事情，那组建上的事情呢，无非就是副组建引入子组建的方式是什么样的，对吧？然后并且呢还有这个组建之间的传直，比如说父传子啊，子传父啊这些这样一些内容。 好，那么现在呢，咱就把这块整体说一下，那么这块呢，也是属于 set up 的一部分，因为我可能会在 set up 里边去操作，所以说呢，干脆把这块笔记呢就写到 set up 里边了哈。呃，因为是这样的，咱们 已经在上节课说过这个路由了，他是第六块哈，那我现在要写组建一块呢，我就写到了四点八之后啊，就四点九啊，来到这呢，咱写一下这个笔记，四点九就是组建的操作，比如说我们这课要讲的是父传子，那父做什么事子怎么接受，对吧？那我们这呢，现在回顾一下选项式 api 的操作啊，就是我们的 vr 的一些写法。那比如我现在呢要有一个子组件，那我这呢可以先新建一个吧， 那我这新建一个组建，比如说就叫 list 吧，随便写一个啊，然后这呢这是子组件， ok， 行，那现在呢，我要在副组件中引入这个组件，那我这就引 proto， 然后这有个 list， 是吧？然后这有 让我们去找到我的这个对应的路径。好，然后下面是 list 点儿， ok， 然后在这儿呢有 export 啊， part 有一个地方的好，然后这里，哎，地方啊 好，然后在这呢有一个 ctrl nast， 然后再往下，这里边呢有一个 list， 是吧？然后呢你可以把 list 呢给它放到这儿啊， list， okay， 那这样的话呢，我们数据就出来了，是吧？这十五键引入没有问题，那么要给他传直呢，也比较简单，我们可以再定一个数据，比如说呢，就叫 m s j 啊，这是数据，这是传过去的数据。好， 那么我在这呢就可以写一个 m s j 等于 m j， 是吧？然后这儿呢就通过 props 呢进行接收，然后这儿呢我就 s pro 啊，笔放进去，然后这儿有一个 pro s， 当然 pro s 有很多写法，比如说我就直接这么去想哈，我定义他的类型和默认值了啊，然后这儿呢有一个 m s j 啊，这肯定都是没有问题的，我们刷新一下啊，这是没有问题的， ok， 当然这是我们熟悉的 view 二写法，那在 view 三中该怎么办呢啊？ view 三呢，我们可以也这么去写，但是呢，有一个比较重要的东西就是塞大，是吧，你也 也可以直接通过 set up 的语法糖去做，都是可以的。那现在呢，我们就通过几个方式呢来实现啊？第一个方式呢，就是我们直接去写这种语法堂形式啊，写语法堂形式，比如说我这呢直接给他写一个 set up 啊，就是我们这的 set up 的语法啊。好，那么呃，首先呢，我们要引入也是跟之前一模一样的啊，引入，然后引入完事以后呢，就可以直接在这提供了啊，就不需要再什么呃，这个 compoints 啊之类的啊，直接用就可以了。好，我们刷新一下 来，小心。好，大家看是不是呢，比之前稍微方便了一点，对吧？那你要传值该怎么办呢？哎，比如或者定一个值就叫 msj， 对吧？然后这呢就等于二 ef， 它是一个响音的，这是负传过去的数据。 好，然后呢我这地方呢就可以给他写 m s j， 然后等于 m s j 了。好，这样就没有问题了。 ok， 然后呢这个子这儿呢，我现在写 m s j 肯定是不行的，对吧？那我要去接收。那怎么去接收呢？有很多方式，比如啊，我们这 这个地方呢，也是一个 set up 的一把糖。好，那我们就可以通过某一个东西了，比如说我们可以通过这个底饭的 plus plus 啊，就它啊，这有个 view， 这，这有一个。呃， from view 就可以了啊，只不过呢我们是引入过这个插件啊，所以说这一步呢就不需要了啊，我们直接写它就可以了啊，直接写它就行了。好，然后这儿呢，你要写的是这个 m i j， 对吧？那你可以定义它类型，比如它类型呢是一个字串类型，然后它有它的默认值啊，比如它的默认值呢？哎，是一个。 呃，一一吧，我随便写啊，那这时候我们再来看刷新一下。好，你看这数据呢，也都给他拿过来了，是吧？那如果说你这并没有给他传呢，他就会走那一串一的这个数据啊，这就是通过三大法与法行的形式啊，如何传？如何接？好吧，这呢我们就记录一下啊。 呃，那这个地方的腹啊腹，哎，可以这样去传。好，我把这呢都给他拿过来， 然后这个地方的子呢？哎，就可以通过刚才我们的方式去积，当然其实呢还有很多很多的方式。那决定了是你的需求啊，那比如说在他的官网里边呢，他也收到了一个这样东西，我们把这个赛道打开啊， 然后这呢他说 set up 这个函数时，他将接收两个参数，一个是 props 啊，还有一个。好，那我们就先单看这一个 props 啊，他说这个 set up 函数呢，第一个参数呢就是 props， 那这个 pro 词就是什么？就是你传过来的一个东西，我们可以在 set up 里边呢去把它拿到。好吧，那，那什么意思呢？就是你看现在呢，我通过啊，这个负啊，通过这儿 miz 传过去，对不对？你也可以怎么写呢？也可以这样去写。 好，我们就采用选 a p l， 然后这 sport 你放是吧？然后呢就跟他这个官方里边写的是一模一样的啊，首先呢，你这儿可能会写一个 set up 啊，是的，然后这儿呢就有一个 pros。 好，我们现在呢去 consolelog 打印一下这个 pros 吧。好，那么在这儿呢 就可以打印一下 pros， 来看一眼 pros 是什么样子啊？刷新一下。好，这时候呢，在这个地方呢啊，我们有一个 pros， 我打开这个地方的一个 tag 啊，哎，他这并没有显示出来一些内容。呃，这有个啊，没关系啊，那我们就呃先给他啊，这还有一个 pros 没有写到啊，我这呢再写一个 m s j 啊， m s j。 好，刷新一下，我们再来看一眼。好，这时候呢，你就看到这个地方是不是有数据啊啊，这个选项 a p i 呢，就几乎类似了哈，那你也可以针对于这样拿到那个 force 啊，拿到 pro s 的数据啊，就是你 pro s 点 m f j 啊，当然他这也讲到了，如果你传多个呢啊，你也可以把它结构出来啊，通过 to i f s 啊，把它结构出来，比如说你在这地方呢可以进行二次的一些调整啊，比如你可以复个值，对吧？那我假如说不叫 m x j， 是吧？我叫这个 o b g 吧，随便啊，那就可以 i f， 哎，或者说直接放它就行了啊，直接放它，然后这样呢蕊衬出去这个 o b g， 好吧，然后你这样放这个 o b g 啊，上心一下，哎，这样的话呢， 也是没有问题的，你可能会针对于这个值呢进行一些改造啊，或者说，呃，这个二次的一些计算呀，等等一些操作啊，这样的写法也是 ok 的。好吧，这就是我们所说的直接通过依法行式啊，通过依法行式，比如这种啊，或者说呢，你也可以通过选项 api 的啊，这种以及这种啊， 以及我们下面的最后这个，是吧？这个一开始演示这个也是可以的啊，这就是妇产子啊，那在我们这个 vivo 三中呢，灵活境比较高了啊，你有很多写法，那这一不同写法呢，也有不同的操作，但是大家呢？呃，以上那些东西都比较简单，大家至少要记得这个哈，至少要记得这个啊，笔犯的 pros， 这个是比较重要的。 好，那么有关于组建之间的这个内容，比如说父算子啊，父怎么传，子怎么金，我们就先说到这里。
59小爽AI产品经理
