随笔分类 -  前端

摘要: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)
摘要:定位分为:静态定位、相对定位、绝对定位、固定定位 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)
摘要: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)
摘要: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)
摘要:过滤器是对即将显示的数据做进一步的筛选处理,然后进行显示,值得注意的是过滤器并没有改变原来的数据,只是在原数据的基础上产生新的数据。 过滤器的使用: 1、定义全局过滤器 在main.js中配置全局过滤器: import moment from 'moment' Vue.filter('dateFor 阅读全文
posted @ 2020-04-25 20:15 recommencer 阅读(169) 评论(0) 推荐(0)
摘要:步骤: ①在目标元素外包裹<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的生命周期 生命周期三个大的阶段1|初始化显示;2更新显示;3死亡。每个阶段就会调用对应的生命周期函数。vue中叫钩子函数 beforeCreate created beforeMount mounted beforeUpdat 阅读全文
posted @ 2020-04-25 19:56 recommencer 阅读(289) 评论(0) 推荐(0)
摘要:v-model 指令在表单控件元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。 v-model 并不关心表单控件初始化所生成的值。因为它会选择 Vue 实例数据来作为具体的值 <template> <!-- 表单数据自动收集 --> <div> <form action="/x 阅读全文
posted @ 2020-04-25 19:50 recommencer 阅读(532) 评论(0) 推荐(0)
摘要: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)
摘要: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)
摘要: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)
摘要:在某些应用界面中,某些元素的样式是变化的,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 是渐进式javascript 框架,渐进式是指vue有自己的核心库,需要其他功能,可以添加插件。 作用:动态构建用户界面(将后台数据动态显示在页面上) Vue 特点: 1、遵循MVVM模式 M:model (模型,数据对象,data) V:view (视图,模板页面) VM:viewMode 阅读全文
posted @ 2020-04-10 10:57 recommencer 阅读(320) 评论(0) 推荐(0)
摘要:<!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)