- 博客(35)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 VueRouter之props参数
不么在DetailView.vue这个页面中，就可以直接使用传递过来的params参数了。只要在配置路由的时候增加props:true。
2024-12-31 16:11:10
335
原创 VueRouter 之 命名路由
然后再router-link的时候，就可以通过制定name的方式进行跳转了。首先在路由配置的时候增加name配置。命名路由可以用于简化编码。
2024-12-31 14:41:24
135
原创 VueRouter之HelloWorld
在src/router/index.js中配置路由。在main.js中引入router。Vue2对应VueRouter3。Vue3对应VueRouter4。点击首页、关于，调到对应的组件。我们做一个简单的案例。
2024-12-30 21:01:52
287
原创 Vuex之mapActions、mapMutations
去调用actions、mutations中的方法，太不方便了。如果需要传递参数，参数在调用处传递。Vuex提供了语法糖。
2024-12-30 10:04:38
219
原创 Vuex之mapState与mapGetters
在组件中通过 this.$store.state.sum 这种形式去获取Vuex state或者getters中的数据，写法上不方便。如果组件中，变量的名称和Vuex中定义的不一样，则可以使用对象写法。mapState和mapGetters就提供了一种简单的写法。在组件中的计算属性中，使用下列方式获取。Vuex中定义了sum和bigSum。
2024-12-30 09:52:31
244
原创 Vuex之getters
Vuex中数据如果被组件事情前需要加工一下再进行展示，该怎么办？“加工过再进行展示”，就很容易理解为计算属性。千万别忘记暴露这个getters。Vuex也有属于自己的计算属性。
2024-12-25 23:10:05
238
原创 Count计数器Vuex版本
任何组件上，都可以通过 this.$store.dispatch 操作store中的action方法。通过this.$store.commit操作store中的mutation方法。当有数据需要在多个组件中被使用的时候，就可以使用Vuex。Vuex实现了数据的共享。搭建Vuex开发环境。
2024-12-25 22:52:19
147
原创 TODOList案例
这里写目录标题创建项目组件化编程的一般流程页面拆分静态页面组件化数据动态展示功能1：添加待办功能2：勾选功能3：删除功能4：底部统计功能5：全选、清除已完成功能6：本地存储改造改造：自定义事件->子组件向父组件发送数据完整代码创建项目组件化编程的一般流程静态组件：使用组件，实现页面静态下的效果展示动态数据：页面中的数据，通过data获取，确定数据类型，存储在哪个组件交互页面拆分根据页面拆分，创建相关组件静态页面组件化将index.html、index.css中的内容迁移
2024-12-24 15:32:11
509
原创 Vue组件之mixin
我们在编写vue组件的时候，不同组件之间，可能有很多相似之处，我们可以把这些相同的地方提取出来。提取到一个js文件中，假设这个文件名叫 mixin.js。在需要用到这个配置的vue文件中进行使用。这样一来，我们的代码就更加精炼了。
2024-12-23 13:43:01
129
原创 Vue之计算属性
我们当然可以直接把那个fullName写成{{first_name+last_name}}，但这样不够优雅。当我们在页面上的某个值是通过二次加工而来的情况下，把加工逻辑放在我们定义的函数上。所以我们引入计算属性的概念。
2024-12-18 15:52:47
140
原创 Vue之键盘事件
这往往并不是我们想要的效果。我们希望回车的时候，确定输入框都输入完了，再执行showInfo，这个时候就可以用到键盘修饰符 .enter 修改代码如下。在输入框中，每输入一个字符，showInfo都会被执行一次。
2024-12-18 15:38:03
176
原创 Vue之事件修饰符
a href="http://www.baidu.com" @click.prevent="showInfo">百度一下</a>在这段代码中，默认情况下，点击链接后，除了处理事件，弹出个提醒框外，关闭提醒框后，还会打开百度链接。如果不想打开百度链接，那么可以使用事件修饰符prevent，即改为。以下列举常见的事件修饰符。
2024-12-18 11:05:37
172
原创 Vue之数据绑定
而双向数据绑定的输入框中，既可以展示vue实例中的值，同时可以通过修改输入框中的值，影响vue实例。所谓数据绑定，就是建立起vue实例中的数据，和html页面元素之间的关系。一种是双向数据绑定，html中页面元素的变更，影响vue实例中的属性值。一种是单向数据绑定，即html元素中单向读取vue实例中的属性值。当我们在单向数据的输入框中输入数据时，是不能影响vue实例的。html中能够录入数据的，都是input标签。
2024-12-17 23:07:38
197
原创 Vue之模板语法
一种是写在标签属性的，叫做vue指令，以 v- 开头。这里演示了一个v-bind，简写为 : ，用于绑定vue实例中的数据到html标签中的属性值。其值也可以是任何合法的js表达式。模板语法分为两部分，一种是写在标签内部的，叫做插值语法，用 {{}} 包裹。可以写任何合法的js表达式。vue提供了一批实用的指令。
2024-12-17 22:44:38
132
转载 CSS学习第四天：flex、grid
Flex 布局教程：语法篇 - 阮一峰的网络日志Flex 布局教程：实例篇 - 阮一峰的网络日志CSS Grid 网格布局教程 - 阮一峰的网络日志
2024-12-09 19:27:24
32
原创 CSS学习第三天：布局之浮动、定位
块级元素、行内元素、行内块元素，这三种元素类型有自己的排列规则。但是这种排列规则是无法满足我们复杂的页面布局要求的。于是就出现了各种布局技术。float、position布局，或者说叫浮动定位布局，就是一种比较古早时期的布局方案。通过前面对块级元素特性的学习，我们可以看到上述排列结果如果我们想要让他们左右排列在一行该怎么弄呢？一旦设置了float，元素就脱离了原本的文档，“浮”了起来当我们仅对app1设置float的话会发现app2的框框不见了、这是因为app1浮了起来，app2就感受不到app1
2024-12-05 15:28:13
1737
原创 对孩子教育的一点想法
如果单单只是为了家长的表扬，学校的夸奖，太低级了，难以形成内驱性，持久的学习动力。3、孩子是一个独立的个体，不是父母攀比的工具，指责孩子前先想想自己孩子时是个什么德行，对孩子宽容点。在学习成绩上，以大多数人的努力程度之低，学习方法习惯之糟糕，还远没到拼天赋的时候。至于在具体行为举措上，都说什么要对孩子有爱，有耐心，要营造XX样的家庭氛围。说完全无用肯定的不准确的，但90%以上都是垃圾，这个结论是没问题的。说到底，在对待孩子教育方面，也只是孩子人生的一个阶段。所以，对于孩子，看开点。
2024-12-04 10:27:51
220
原创 CSS学习第二天：元素类型与盒子模型
当指定一个 CSS 元素的宽度和高度属性时，只是设置内容区域的宽度和高度。要知道，完整大小的元素，还必须添加内边距，边框和外边距。2、行内元素没有自己的形状，不能定义宽高。在行内元素中，有几个比较特殊，同时具有行内元素和块级元素的特点：img、input、td。如：p标签，是块级元素，但不能编写其他块级元素作为p的子元素。3、行内元素只能容纳其他行内元素，或文本。所有的html元素，都可以看做是一个盒子。1、块级元素、行内元素，特性与转化。4、块级元素可以作为其他元素的容器。div用的最多，多用于布局。
2024-12-03 22:58:22
1391
原创 CSS学习第一天：基本概念与简单样式
1、CSS基本概念2、简单样式属性1、CSS是用来美化Web页面的2、形式上，CSS由选择器和键值对构成案例说明body {h1 {p {
2024-12-02 13:35:36
278
原创 HTML浅学一下：多看手册多写代码
meta：文档元信息title：文档标题base：文档内链接默认标签style：css样式link：外部css、jsscript：文档内js内联样式：标签的style属性中定义样式" > 这是一个标题 < p style = " background-color : green;" > 这是一个段落。" > 这是一个标题 < p style = " background-color : green;
2024-12-01 22:16:20
1922
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人