![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端开发
以上比较偏向后端的前端知识,不会深入只要求看懂前端代码。
godpunishv3
这个作者很懒,什么都没留下…
展开
-
什么是属性计算,以及为什么要使用属性计算
这里的模板看起来有些复杂。我们必须认真看好一会儿才能明白它的计算依赖于 `author.books`。更重要的是,如果在模板中需要不止一次这样的计算,我们可不想将这样的代码在模板里重复好多遍。模板中的表达式虽然方便,但也只能用来做简单的操作。如果在模板中写太多逻辑,会让模板变得臃肿,难以维护。比如说,我们有这样一个包含嵌套数组的对象。因此我们推荐使用**计算属性**来描述依赖响应式状态的复杂逻辑。原创 2024-07-01 15:12:12 · 86 阅读 · 0 评论 -
什么是vue3视图渲染技术
当上面发生数据关联时,vue会把代码生成dom数据。生成dom树的过程我们称其为渲染。首先问自己what。原创 2024-07-01 10:44:12 · 122 阅读 · 0 评论 -
响应式数据如何处理
counter在script中,和template中操作的时候,一个要加点value一个不用。但其实他们是一个东西,在内存地址也是一样的。所以建议使用reactive。先将数据转换成响应式数据。其中还可以互相转换如下。原创 2024-07-01 11:16:18 · 160 阅读 · 0 评论 -
vite+vue响应式数据的入门,setup函数
下面是最简单的使用,我们需要在script标签中使用setup构建数据和定义方法。int i = 1;还是问why,如上图。比如你添加购物车,你肯定要选择件数。你点+,数字要加1。接着在template标签中定义。原创 2024-07-01 10:30:43 · 97 阅读 · 0 评论 -
为什么要使用vue+vite组件开发,以及如何使用。
首先,什么是组件,以及为什么要用组件。什么是组件看下图一目了然,为什么要用组件就和java代码一样,我自然希望可以做到代码复用了。template标签则是用来进行页面布置的。比如一个页面有没有按钮之类的。style标签是用来定义你的字体大小,颜色等样式信息的。script标签则是用来写一些业务逻辑的。原创 2024-07-01 09:28:11 · 124 阅读 · 0 评论 -
前端工程化各个文件的关联,或者前端代码如何变成一个网页
接下来,到main.js文件中,我们清楚的发现,这个文件,分别调了app.vue负责网页,还有路由的信息,以及开启了pinia.通过上图代码,我们成功的去到src/main.js文件中找我们的组件。以及我们网页需要的其他的配置。我们可以发现这个组件还可以引入其他的组件。首先一开始我们肯定得有一个入口吧。index,html文件就是我们的入口。以此类推我们可以引入多个vue组件来构成我们的页面。我们的代码如何变成一个网页呢?接着我们就到vue组件上了。原创 2024-07-01 09:46:20 · 106 阅读 · 0 评论 -
CSS样式的导入
还是先问自己why?我们在style里面可能需要多个样式共我们使用,比如你标题和正文的字体的大小和颜色肯定不能一样对吧?所有我们需要多个样式供我们使用。当然,如果一个样式如果你想在所有的vue文件中有效。你需要在main.js中导入。但是这样处理还是有问题,我们把样式和其他的放一块,我们无法做到跨文件使用。所以我们需要将css样式放到一个单独的文件中。style/test.css文件就是我们css目录样式了。先定义一个class引入样式的代号。接下如何引入,在vue文件中使用。第二种在style标签上。原创 2024-07-01 10:03:34 · 185 阅读 · 0 评论 -
vue3.文本渲染命令
多的不想说,文本渲染命令如上图所示。原创 2024-07-01 10:49:34 · 78 阅读 · 0 评论 -
事件如何绑定,如何操作
上面代码是让点击的时候,在跳转的同时执行fun3事件。内联事件处理器,就是把业务逻辑写button里面了。必须要传事件才能在fun3中对事件进行操作。$event传入事件。原创 2024-07-01 11:05:35 · 100 阅读 · 0 评论 -
vite+vue3项目的目录结构
vite.config配置项目。比如可以配置端口号。src.plugin放一些vite插件相关的东西。src.store放和vue状态管理有关的文件。src.router放一些和路由相关的东西。node_modules目录 放一些依赖。src.components 放组件的。src.utils放一些通用的工具类。src.assets放静态资源的。src.pages放页面级组件的。pulice 存放公共资源的。原创 2024-07-01 09:18:49 · 181 阅读 · 0 评论 -
vite构建工程化前端项目
的全称是Node Package Manager,是一个NodeJS包管理和分发工具。npm create vite命令引入vite。package.json就是记录着我们的依赖。和pom文件一样,我们需要下载文件。下载文件命令npm i。或者npm install.和后端一样,依赖太多需要自己一个一个导入不现实。自然需要一个工具帮我们构建了。运行命令npm run dev。首先我们需要一个npm,帮我们引入vite。接着我们就出现在这样一个项目结构。原创 2024-07-01 09:07:06 · 156 阅读 · 0 评论 -
属性渲染命令
该代码的效果,会显示一张图片。你鼠标悬停在图片上会出现.data.name绑定的信息,如果你点击会跳转网页到data.url.原创 2024-07-01 10:54:00 · 100 阅读 · 0 评论 -
vue技术1,非工程化快速体验
用途,可以让页面快速的动态变化。以及一个vue.ceateApp可以被多个使用。值得注意的是只有return里面有的参数才会被挂上去。首先定义挂点,并且构建将app挂上。原创 2024-06-29 17:02:22 · 139 阅读 · 0 评论