![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
html
sen丶晓森
这个作者很懒,什么都没留下…
展开
-
localstorage和sessionstorage的区别
localstorage和sessionstorage的区别原创 2022-03-09 19:33:17 · 21266 阅读 · 0 评论 -
<img>标签中alt属性和title属性的区别
alt属性的特点:①倘若图片加载不成功未能显示出来,就会在图片未显示的地方出现一段文字。这一作用是为了给未加载出来的图片提供信息,方便用户浏览网页,同时也方便开发人员维护网页。②搜索引擎可以通过这个属性的文字描述获取图片 title属性的特点:title属性可以用在任何元素上,当用户把鼠标移动到元素上时,就会出现title的内容,起到对图片说明的作用,其实质就是对图片的一种备注或者注释...原创 2022-03-09 19:07:12 · 378 阅读 · 0 评论 -
HTML语义化
html的语义化原创 2022-03-02 13:43:40 · 389 阅读 · 0 评论 -
link标签和import标签的区别
link标签和import标签的区别原创 2022-02-19 16:06:39 · 330 阅读 · 0 评论 -
VUE.JS-全局路由守卫、独享路由守卫、组件内路由守卫
1、全局路由守卫在index.js中写入即可://全局前置路由守卫————初始化的时候被调用、每次路由切换之前被调用router.beforeEach((to,from,next)=>{ console.log('前置路由守卫',to,from) if(to.meta.isAuth){ //判断是否需要鉴权 if(localStorage.getItem('school')==='heikeji'){ next() }else{ alert('学校名不对,无权限查看!')原创 2021-11-30 11:18:32 · 808 阅读 · 0 评论 -
VUE.JS-路由的props配置
在其相应的单页面文件中写入:<template> <ul> <li>消息编号:{{id}}</li> <li>消息标题:{{title}}</li> </ul></template><script> export default { name:'Detail', props:['id','title'], computed: { // id(){ //原创 2021-11-30 09:34:11 · 512 阅读 · 0 评论 -
VUE.JS-路由的基本使用、多级路由与路由的query参数
先创建router文件夹,并在其目录下创建index.js文件:// 该文件专门用于创建整个应用的路由器import VueRouter from 'vue-router'//引入组件import About from '../components/About'import Home from '../components/Home'//创建并暴露一个路由器export default new VueRouter({ routes:[ { path:'/about', co原创 2021-11-30 09:17:25 · 422 阅读 · 0 评论 -
VUE.JS-mapMutations与mapActions
<template> <div> <h1>当前求和为:{{sum}}</h1> <h3>当前求和放大10倍为:{{bigSum}}</h3> <h3>我在{{school}},学习{{subject}}</h3> <select v-model.number="n"> <option value="1">1</option> <option原创 2021-11-30 08:10:31 · 272 阅读 · 0 评论 -
VUE.JS-getters、mapState与mapGetters
创建getters://准备getters——用于将state中的数据进行加工const getters = { bigSum(state){ return state.sum*10 }}//创建并暴露storeexport default new Vuex.Store({ actions, mutations, state, getters})使用getters:<h3>当前求和放大10倍为:{{$store.getters.bigSum}}</h3&原创 2021-11-29 14:55:18 · 451 阅读 · 0 评论 -
VUE.JS-求和案例_vuex版
Count.vue:<template> <div> <h1>当前求和为:{{$store.state.sum}}</h1> <select v-model.number="n"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option&g原创 2021-11-29 14:47:58 · 327 阅读 · 0 评论 -
VUE.JS-插槽
1、默认插槽首先创建一个组件category.vue:<template> <div class="category"> <h3>{{title}}分类</h3> <!-- 定义一个插槽(挖个坑,等着组件的使用者进行填充) --> <slot>我是一些默认值,当使用者没有传递具体结构时,我会出现</slot> </div></template><script>原创 2021-11-29 11:44:01 · 561 阅读 · 0 评论 -
VUE.JS-配置代理服务器
<template> <div> <button @click="getStudents">获取学生信息</button> <button @click="getCars">获取汽车信息</button> </div></template><script> import axios from 'axios' export default { name:'App', met原创 2021-11-29 11:34:14 · 272 阅读 · 0 评论 -
VUE.JS-过度与动画
<template> <div> <button @click="isShow = !isShow">显示/隐藏</button> <transition name="hello" appear> <h1 v-show="isShow">你好啊!</h1> </transition> </div></template><script> export原创 2021-11-29 11:27:09 · 235 阅读 · 0 评论 -
VUE.JS-组件自定义事件
<template> <div class="student"> <h2>学生姓名:{{name}}</h2> <h2>学生性别:{{sex}}</h2> <h2>当前求和为:{{number}}</h2> <button @click="add">点我number++</button> <button @click="sendStudentlName">原创 2021-11-29 11:11:21 · 139 阅读 · 0 评论 -
VUE.JS-scoped样式
vue组件中的style标签标有scoped属性时表明style里的css样式只适用于当前组件元素使用方法如下:<style lang="less" scoped> .demo{ background-color: pink; .atguigu{ font-size: 40px; } }</style>原创 2021-11-29 10:57:12 · 180 阅读 · 0 评论 -
VUE.JS-mixin混入(合)及插件
混合:在mixin.js文件中写入export const hunhe = { methods: { showName(){ alert(this.name) } }, mounted() { console.log('你好啊!') },}export const hunhe2 = { data() { return { x:100, y:200 } },}之后在main.js中引入:import {hunhe,hunhe2} from './原创 2021-11-29 10:52:57 · 165 阅读 · 0 评论 -
VUE.JS-props声明接收
<template> <div> <h1>{{msg}}</h1> <h2>学生姓名:{{name}}</h2> <h2>学生性别:{{sex}}</h2> <h2>学生年龄:{{myAge+1}}</h2> <button @click="updateAge">尝试修改收到的年龄</button> </div></tem原创 2021-11-29 10:40:29 · 293 阅读 · 0 评论 -
VUE.JS-main.js
npm install webpack -g/*该文件是整个项目的入口文件*///引入Vueimport Vue from 'vue'//引入App组件,它是所有组件的父组件import App from './App.vue'//关闭vue的生产提示Vue.config.productionTip = false/*关于不同版本的Vue:1.vue.js与vue.runtime.xxx.js的区别:(1).vue.js是完整版的Vue,包含:核心功能+模板解析器。(2).vu原创 2021-11-29 10:37:09 · 236 阅读 · 0 评论 -
VUE.JS非单文件组件
Vue中使用组件的三大步骤:一、定义组件(创建组件)二、注册组件三、使用组件(写组件标签)一、如何定义一个组件?使用Vue.extend(options)创建,其中options和new Vue(options)时传入的那个options几乎一样,但也有点区别;区别如下:1.el不要写,为什么? ——— 最终所有的组件都要经过一个vm的管理,由vm中的el决定服务哪个容器。2.data必须写成函数,为什么? ———— 避免组件被复用时,数据存在引用关系。备注:使用template可以配置组原创 2021-11-22 08:44:36 · 88 阅读 · 0 评论 -
VUE.JS-生命周期
生命周期:1.又名:生命周期回调函数、生命周期函数、生命周期钩子。2.是什么:Vue在关键时刻帮我们调用的一些特殊名称的函数。3.生命周期函数的名字不可更改,但函数的具体内容是程序员根据需求编写的。4.生命周期函数中的this指向是vm 或 组件实例对象。//Vue完成模板的解析并把初始的真实DOM元素放入页面后(挂载完毕)调用mounted mounted(){ console.log('mounted',this) setInterval(() => { this.opa原创 2021-11-22 08:38:28 · 148 阅读 · 0 评论 -
VUE.JS计算属性以及监视属性
计算属性:1.定义:要用的属性不存在,要通过已有属性计算得来。2.原理:底层借助了Objcet.defineproperty方法提供的getter和setter。3.get函数什么时候执行?(1).初次读取时会执行一次。(2).当依赖的数据发生改变时会被再次调用。4.优势:与methods实现相比,内部有缓存机制(复用),效率更高,调试方便。5.备注:1.计算属性最终会出现在vm上,直接读取使用即可。2.如果计算属性要被修改,那必须写set函数去响应修改,且set中要引起计算时依赖的数据发原创 2021-10-08 15:35:05 · 124 阅读 · 0 评论 -
VUE.JS之数据代理以及事件处理
1.Vue中的数据代理:通过vm对象来代理data对象中属性的操作(读/写)2.Vue中数据代理的好处:更加方便的操作data中的数据3.基本原理:通过Object.defineProperty()把data对象中所有属性添加到vm上。为每一个添加到vm上的属性,都指定一个getter/setter。在getter/setter内部去操作(读/写)data中对应的属性。事件的基本使用:1.使用v-on:xxx 或 @xxx 绑定事件,其中xxx是事件名;2.事件的回调需要配置在metho原创 2021-10-05 16:36:54 · 231 阅读 · 0 评论 -
VUE学习之MVVM模型及Object.defineProperty
MVVM模型1. M:模型(Model) :data中的数据2. V:视图(View) :模板代码3. VM:视图模型(ViewModel):Vue实例观察发现:1.data中所有的属性,最后都出现在了vm身上。2.vm身上所有的属性 及 Vue原型上所有属性,在Vue模板中都可以直接使用。Object.definePropertyenumerable:true, //控制属性是否可以枚举,默认值是falsewritable:true, //控制属性是否可以被修改,默认值是falseco原创 2021-09-17 13:29:46 · 119 阅读 · 0 评论 -
列表
HTML HTML负责网页的结构 CSS CSS负责页面中的表现有序列表(ol)和无序列表(ul),使用 li 标签来表示列表中的一个项。有序列表 结构 表现 行为无序列表 结构 表现 行为列表之间可以互相嵌套,可以在一个有序列表中放一个无序列表,也可以在无序列表中放有序列表。有序列表嵌套无序列表 123456 12 ...原创 2020-12-19 12:27:00 · 107 阅读 · 1 评论 -
HTML转义字符
在HTML中多个空格和换行会被解析为一个空格可以使用实体(转义字符)来表示一些特殊的符号语法:&实体的名字;空格 大于号 >小于号 <版权符号 ©&#Unicode编码;原创 2020-12-04 17:27:51 · 151 阅读 · 0 评论