- 博客(41)
- 收藏
- 关注
RSS订阅原创 语义化标签
HTML5可以让很多更语义化结构化的代码标签代替大量的无意义的div标签，这种语义化的特性提升了网页的质量和语义，对搜索引擎更加的友好，他们这些标签功能就是代替功能中的一部分，他们没有任何的默认样式，除了会让文本另起一行外；最典型的是侧边栏，其中的内容可以是日志串连，其他组的导航，甚至广告，这些内容相关的页面。hgroup元素代表网页或section的标题，当元素有多个层级时，该元素可以将h1到h6元素放在其内，譬如文章的主标题和副标题的组合。节可以是指一个页面里的分组。...
2022-07-18 03:17:48
182
原创 h5新增表单属性
validity对象，通过下面的valid可以查看验证是否通过，如果八种验证都通过返回true，一种验证失败返回false-----node.addEventListener("invalid",fn1,false);适用于form,以及type为text,search,url,tel,email,password类型的input。当格式不符合email格式时，提交是不会成功的，会出现提示；当格式不符合url格式时，提交是不会成功的，会出现提示；必须有value属性，为了后台获取后的识别（不写统一为on）.
2022-07-18 03:11:09
926
原创 h5音视频标签
canplaythrough在媒体的readyState变为CAN_PLAY_THROUGH时触发，表明媒体可以在保持当前的下载速度的情况下不被中断地播放完毕。canplaythrough在媒体的readyState变为CAN_PLAY_THROUGH时触发，表明媒体可以在保持当前的下载速度的情况下不被中断地播放完毕。如果没有设置，或者比最大值还大，其值即为最大值。现在的视频编解码器会使用各种技巧减少从一帧到另一帧过程中传递的信息数量，它们不会存储每一帧的所有信息，而只是存储两帧之间的差异信息。...
2022-07-18 02:34:35
467
原创 canvas知识点
生成路径的第一步叫做beginPath()。元素只是创造了一个固定大小的画布，要想在它上面去绘制内容，我们需要找到它的渲染上下文,有一个叫做getContext()的方法，这个方法是用来获得渲染上下文和它的绘画功能。放大放大画布，画布中的一个css像素所占据的物理面积变大，画布中包含的css像素的个数变少，画布中图像所包含的css像素的个数不变。缩小缩小画布，画布中的一个css像素所占据的物理面积变小，画布中包含的css像素的个数变多，画布中图像所包含的css像素的个数不变。...
2022-07-17 02:14:16
1325
原创 bind函数绑定事件
调用：obj ： 要绑定事件的对象 eventStr : 事件的字符串 callback ：回调函数bind( box , "mouseup" ,function(){ alert("111")})
2022-07-01 15:38:42
187
原创 git 版本管理
网址：Git - 安装 Git1.安装：选择安装目录，接着下一步下一步即可在桌面上右击，有图中的：Git GUI Here 和Git Bash Here 代表安装成功在Git Bash Here中：git --version 查看git版本git 三大区域：工作区红色-- 暂存区绿色-- 版本库2.在项目文件夹中：git init 初始化git status 检测当前文件夹的文件状态git add . 管理所有的文件(工作区->暂存区)git...
2022-05-17 15:28:29
3889
2
原创 echarts Y轴只显示整数，或保留n位小数
yAxis: [ { type: 'value', minInterval: 1//只显示整数 } ],axisLabel: { //保留一位小数 formatter: function (value, index) { return value.toFixed(1); .
2022-05-12 10:28:05
1520
原创 elementUI中Message 消息提示的样式修改
注意：若是用的是less,加了scoped，就在原先的style的外面新加一个<style lang="less"></style>标签，因为elementUI中不能修改的样式不能在scoped中生效 this.$alert("请先添加转供线路", '提示',{ customClass :'el-message-box_style' });<style lang="less"> .el-message-box_style { .el
2022-04-27 16:45:28
4405
原创 Node.js跨域
1.出现跨域app.js：const express = require("express");const app = express();const PORT = 3000;app.get("/data", (req, res) => { res.send({ name: "张三", age: 12 }});app.listen(PORT, () => { console.log(`服务器已经启动在${PORT}上`);});index.html:&l
2022-04-26 14:22:56
1693
原创 电商经营模式
1.B2B：商家与商家--阿里巴巴2.B2C:商家与个人--京东，苏宁易购3.C2B:个人与企业--猪八戒4.C2C：个人与个人--淘宝，咸鱼5.O2O:线上销售，线下服务--饿了么，淘淘票
2022-04-24 14:33:25
184
原创 日期控件当前以后时间禁用
<el-date-picker :picker-options="pickerOptions" />data(){ return{ pickerOptions:{ disabledDate( time ){ return time.getTime() =>( Date.noe=w() -24*60*60*1000 ) } } }}...
2022-03-30 09:07:54
125
原创 基于webpack创建项目脚手架,项目名project
第一步：构建脚手架cd my-appnpm run devconfig/index.js文件:port: 8080, //修改端口号autoOpenBrowser: false, //自动打开浏览器第二步：开发①src/components/module文件夹下创建四个组件文件：Find.vue Home.vue Order.vue My.vue<template> <div>订单</div></template.
2022-03-07 23:34:49
455
原创 版本控制git
老大1 、码云1.1 创建meituan空仓库1.2 给本地仓库绑定远程仓库1.3 推送到码云 git config --global user.name "张三" git config --global user.email "12345678990@163.com"git add . git commit -m 'feat: init2' git push1.4 基于master创建dev、master保护、dev默认master ->管理->...
2022-02-14 15:32:17
62
原创 导航 守卫
运行显示login页面，手动在浏览器中application中输入token值，即可访问carts、goods页面<div id="root"> <router-view></router-view></div><script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script><script src="https://unpkg.com/vue.
2022-02-11 16:36:55
331
原创 项目运行初始配置
1.项目运行流程（规则）思考：cnpm run serve干了啥1 去package.json的scripts键中找serve键2 去运行src/main.js（整个项目入口文件3 入口文件核心的代码 new Vue el:"#app" 默认显示App组件数据 4 然后切记App组件挖坑显示 路由匹配的组件数据思考：浏览器输入/或/about干了啥1 根据浏览器【请求路径】去【src/router/index.js】中匹配2 匹配不到-坑不显示，匹配到了-获取组件数据
2022-02-11 15:56:31
804
原创 vue脚手架
vue-cli脚手架工具：用来生成vue框架代码的命令行工具安装-【随便找个目录执行】指定版本： cnpm i @vue/cli@4.5.11 -g 验证：vue -V 首次安装：? Your connection to the default npm registry seems to be slow. Use https://registry.npm.taobao.org for faster installation? (Y/n) Y步骤1：创建项目 vue create tes..
2022-02-11 15:43:30
453
原创 插槽 slot
提示组件、因为父传值props不支持超文本，所以文本-利用props、超文本-slot插槽1.后备插槽 <tips><p>请登录后再操作</p></tips>Vue.component('tips', { // 声明组件数据 template: ` <div style="width: 370px; line-height: 45px;border:solid 2px red;">
2022-02-11 14:27:31
265
原创 vue组件通信
1.props<div id="root"> <mytag :a="1" :b="2" :c="{uname:'张三',sex:'男'}" :d="100"></mytag></div><script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script><script> Vue.component('mytag', { // pr
2022-02-11 10:11:37
60
原创 组件component
①全局组件components/index.js文件中：Vue.component('mytag', { template: `<div>放HTML代码</div>`, // template 模板 也就是html data() {return {}}, methods: {}, watch: {}, ....})views/index.html文件中：使用组件：<mytag></mytag>
2022-02-10 15:41:57
337
原创 input输入框自动获取焦点
<input type="text" v-myfocus>Vue.directive('myfocus', { // 通过 v-myfocus来调用 inserted(el) { // 当前标签对象 el.focus() }})
2022-02-10 10:55:31
585
原创 全局过滤器filter
①传递一个参数<h1>{{time | dateFormat}}</h1> data: { time: new Date }Vue.filter('dateFormat', (dateData) => { // 默认有一个形参就是要过滤的数据 return dateData.getFullYear() + '-' + (dateData.getMonth()+1) +'-' + dateData.getDate()})②传递两个参数&
2022-02-10 10:41:29
249
原创 计算属性computed和侦听器watch区别
相同点： 1. 语法角度（ a 从思想上都是普通方法升级版 b 都可以写函数或对象2. 研发角度：计算属性-减少冗余、缓存提升性能、侦听器-减少DOM操作 符合VUE响应式思想 不同点： 1. 从语法角度：调用时，计算属性调用不加小括号，侦听器不能调用2. 从功能角度：计算属性有缓存、响应式依赖，侦听器没有缓存常用于搜索、监控数据变化、代替事件等,计算属性可以监听多个模型数据变化，侦听器只能监听一个数据变化。...
2022-02-10 10:28:19
702
原创 侦听器-watch
先v-model变化、2 再触发watch方法场景：网站搜索、监控弹框显示二维码、模糊筛选、关键词筛选、日期筛选、下拉筛选、全选、全不选等①监听 字符串 搜索框： <input type="text" v-model="search" placeholder="请输入你要搜索的内容..."/> 搜索结果：{{searchContent}} // 声明侦听器 监听模型数据变化 watch: { search(newData, oldData) {
2022-02-10 10:17:57
68
原创 计算属性- computed
作用：1-减少代码冗余便于维护 2-有缓存提升性能 留心：计算属性是基于它们的响应式依赖进行缓存的 也就是说缓存什么时候清除 当他监控的数据变化了 ①vue2中：页面调用： {{reverseCp}}computed: { reverseCp() { // 写方法即可 ...
2022-02-09 17:56:03
695
原创 vue中 class与style样式绑定
1. v-model原理 ：是基于@input/change和v-bind:value封装的语法糖 @input/change底层是 JS事件监控 V同步M v-bind:value底层是 JS的Object.defineProperty监控 M同步V 2.VUE双向绑定/响应式原理 通过触发事件打印vue模型数据，发现每个模型数据都有getter、setter方法，代表使用了 Object.defineProperty进行...
2022-02-09 16:10:16
391
原创 v-model和双向绑定 原理
1. v-model原理 ：是基于@input/change和v-bind:value封装的语法糖 @input/change底层是 JS事件监控 V同步M v-bind:value底层是 JS的Object.defineProperty监控 M同步V 2.VUE双向绑定/响应式原理 通过触发事件打印vue模型数据，发现每个模型数据都有getter、setter方法，代表使用了 Object.defineProperty进行...
2022-02-09 14:07:34
6227
原创 SVN-目录级代码版本管理
SVN 分为客户端、服务端，SVNBucket就是一个 SVN 的服务端，负责托管 SVN 的代码。我们需要使用 SVN 的客户端来跟服务端打交道。在 Windows 上，我们推荐使用 TortoiseSVN。1.svn仓库-服务端https://svnbucket.com/2.svn客户端 TortoiseSVN教程https://svnbucket.com/posts/svn-tutorial/客户端下载和汉化教程https://svnbucket.com/posts/...
2022-02-08 14:56:28
876
原创 数据可视化大屏-Vue项目
一、前端项目准备1.vue-cli 搭建项目npm install @vue/cli -g （一台电脑只执行一次即可）vue create 项目名选 (下键选择 空格确认) ：Manually select features 手动选择：Router Vuex CSS：2.0 xUse history mode for router?是否使用路由: noCSS预处理语言 : Less标准模式：ESLint + Standard conf...
2022-02-08 09:53:48
13674
原创 elementUI--表格
1.页面显示<template> <el-table :data="tableData" border style="width: 100%"> <el-table-column v-for="(item,index) in colum" :key="index" :prop="item.prop" :label="item.label"
2022-01-17 11:35:42
753
原创 Node - Koa2的使用
基于Node.js平台的web开发框架---- async / await1.检查Node环境、安装Koanode -vnpm init -ynpm install koa2.创建文件和文件夹① app.js文件：-- 入口文件// 引入koaconst Koa = require('koa')// 创建koa实例对象const app = new Koa()// 编写响应函数 洋葱模型的中间件// 第一层中间件--总耗时中间件const respDura..
2022-01-12 15:47:46
303
原创 WebSocket的基本使用
一. 后端1.安装包npm i ws -S2.创建对象const WebSocket = require('ws')// 创建WebSocket服务端的对象, 绑定的端口号是9998const wss = new WebSocket.Server({port: 9998})3.监听事件①连接事件wss.on('connection', client => {console.log('有客户连接了‘)}）...
2022-01-11 15:42:13
2101
原创 数据 可视化大屏-Vue-2图表高级配置
1.显示相关①主题内置主题：light darkvar mCharts = echarts.init(document.querySelector("div"), 'light')var mCharts = echarts.init(document.querySelector("div"), 'dark')自定义主题：1.在线编辑主题 https://www.echartsjs.com/theme-builder/2.下载主题的js文件3.在html中导入js文件 .
2021-12-24 16:10:31
772
原创 数据可视化大屏-Vue-1图表基本配置
1.横向柱状图<template> <div class="com-container"> <div class="com-chart" ref="seller_ref"></div> //ref更好的获取dom </div></template><script>export default { data () { return { chartInstance: n
2021-12-24 11:38:31
735
原创 数据可视化大屏-数据动态交互及响应式适配
数据动态交互 方法一：定时器 function getChart() { var request = new XMLHttpRequest(); request.open("get", "http://localhost:3333/get_chart"); request.onreadystatechange = function() { if (request.readyState == 4 && request.statu...
2021-11-09 15:38:14
718
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人