随笔分类 -  前端

css水平居中
摘要：1、元素水平居中 margin：0 auto； 为居中的原因 ①元素没有设置宽度，没有宽度无法居中 ②设置宽度依然不好使，可能设置的行内元素。 示例1： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></t 阅读全文
posted @ 2020-09-07 01:01 recommencer 阅读(186) 评论(0) 推荐(0)
css 几种定位的理解
摘要：定位分为：静态定位、相对定位、绝对定位、固定定位 1、静态定位（static） 一般的标签元素不加任何定位属性都属于静态定位，在页面的最底层，属于标准流。 2、绝对定位（absolute） 绝对定位元素从文档流脱出，使用left、right、top、bottom等属性相对于其最接近的一个最有定位设置 阅读全文
posted @ 2020-09-06 22:00 recommencer 阅读(346) 评论(0) 推荐(0)
登录样式
摘要：html 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>登录</title> 6 <link rel="stylesheet" href="denglu.css"> 7 </head> 阅读全文
posted @ 2020-08-31 00:43 recommencer 阅读(232) 评论(0) 推荐(0)
vue 登录案例
摘要：main.js import App from './App.vue' import Vue from 'vue' import router from './router/' import components from './components/header.js' //加载公共组件 impo 阅读全文
posted @ 2020-04-30 21:51 recommencer 阅读(249) 评论(0) 推荐(0)
记事本
摘要：记事本： 功能：添加任务，可以删除，清空，根据内容进行统计个数，底部元素在没有任何元素的时候慧进行隐藏 思路： 列表结构可以通过v-for指令结合数据生成 v-on结合事件修饰符可以对事件进行限制，比如.enter v-on在绑定事件时可以传递自定义参数 通过v-model可以快速的设置表单元素的值 阅读全文
posted @ 2020-04-26 17:19 recommencer 阅读(239) 评论(0) 推荐(0)
vue 指令
摘要：1、vue 内置指令 v-test 更新元素的textContent v-html 更新元素的innerHTML v-if 如果为true，当前标签才会输出到页面 v-else 如果为true，当前标签才会输入到页面 v-show 通过控制display样式来控制显隐 v-bind 强制绑定解析表达 阅读全文
posted @ 2020-04-25 20:26 recommencer 阅读(162) 评论(0) 推荐(0)
vue 过滤器
摘要：过滤器是对即将显示的数据做进一步的筛选处理，然后进行显示，值得注意的是过滤器并没有改变原来的数据，只是在原数据的基础上产生新的数据。 过滤器的使用： 1、定义全局过滤器 在main.js中配置全局过滤器： import moment from 'moment' Vue.filter('dateFor 阅读全文
posted @ 2020-04-25 20:15 recommencer 阅读(169) 评论(0) 推荐(0)
vue 动画&过渡
摘要：步骤: ①在目标元素外包裹<transition name="xx"> ②定义class样式 指定过度样式:transition 指定隐藏时样式:opacity/其他 注意事项： 1、需要过渡的元素要有 v-if 或者是 v-show 切换 2、将需要添加过渡效果的元素用 <transition>< 阅读全文
posted @ 2020-04-25 20:00 recommencer 阅读(155) 评论(0) 推荐(0)
vue 生命周期
摘要：每个Vue实例在被创建之前都要经过一系列的初始化过程,这个过程就是vue的生命周期 生命周期三个大的阶段1|初始化显示；2更新显示；3死亡。每个阶段就会调用对应的生命周期函数。vue中叫钩子函数 beforeCreate created beforeMount mounted beforeUpdat 阅读全文
posted @ 2020-04-25 19:56 recommencer 阅读(289) 评论(0) 推荐(0)
vue 表单数据自动收集
摘要：v-model 指令在表单控件元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。 v-model 并不关心表单控件初始化所生成的值。因为它会选择 Vue 实例数据来作为具体的值 <template> <!-- 表单数据自动收集 --> <div> <form action="/x 阅读全文
posted @ 2020-04-25 19:50 recommencer 阅读(532) 评论(0) 推荐(0)
vue 事件处理
摘要：1、事件绑定 $event 是触发事件的第一个参数值 2、事件修饰符 .stop 停止事件冒泡 .prevent 阻止事件默认行为 3、按键修饰符 vue中使用element-ui组件中的el-button时，@click事件点击无效,这是因为在el-input 的input外边封装了一层div。如 阅读全文
posted @ 2020-04-23 15:38 recommencer 阅读(208) 评论(0) 推荐(0)
vue 列表渲染以及列表的搜索和排序
摘要：v-for 遍历数组/v-for遍历对象 <template> <div> <h2>测试：v-for 遍历数组</h2> <table> <thead> <tr> <th>姓名</th> <th>年龄</th> <th>号码</th> <th>操作</th> </tr> </thead> <tbod 阅读全文
posted @ 2020-04-12 10:42 recommencer 阅读(1152) 评论(0) 推荐(0)
Vue 条件渲染
摘要：1、条件渲染指令： v-if v-else v-show 2、比较v-if 与v-show 如果需要频繁切换 v-show较好 <template> <div> <p v-if="ok">成功了</p> <p v-else>失败了</p> <p v-show="ok">切换成功</p> <p v-s 阅读全文
posted @ 2020-04-10 16:44 recommencer 阅读(134) 评论(0) 推荐(0)
Vue 强制绑定
摘要：在某些应用界面中，某些元素的样式是变化的，class/style 绑定就是专门来实现动态样式效果的技术 class绑定： ：class=‘xx’ xx可以是字符串、对象、数组 1、class：字符串 动态样式与固定样式 <template> <div> <h2>1.class绑定: :class=' 阅读全文
posted @ 2020-04-10 12:45 recommencer 阅读(375) 评论(0) 推荐(0)
vue 介绍及基本使用（计算属性/监视）
摘要：vue 是渐进式javascript 框架，渐进式是指vue有自己的核心库，需要其他功能，可以添加插件。 作用：动态构建用户界面（将后台数据动态显示在页面上） Vue 特点： 1、遵循MVVM模式 M：model （模型，数据对象，data） V：view （视图，模板页面） VM：viewMode 阅读全文
posted @ 2020-04-10 10:57 recommencer 阅读(320) 评论(0) 推荐(0)
js点击事件
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>js 点击事件</title> <script> function cherk(us){ if(us==''){ alert("请输入用户名") } } fun 阅读全文
posted @ 2019-12-16 23:48 recommencer 阅读(1008) 评论(0) 推荐(0)