I NFINIT Y-CSDN博客

原创 page-skeleton-webpack-plugin骨架屏的使用

1 下载依赖npm install --save-dev page-skeleton-webpack-pluginnpm install --save-dev html-webpack-plugin2 在vue.config.js里面如下配置// 骨架屏开始const HtmlWebpackPlugin = require('html-webpack-plugin')const { SkeletonPlugin } = require('page-skeleton-webpack-plugi

2021-04-02 23:59:55 1207

原创 art-template模板引擎

介绍art-template 是一个简约、超快的模板引擎特点拥有接近 JavaScript 渲染极限的的性能调试友好：语法、运行时错误日志精确到模板所在行；支持在模板文件上打断点（Webpack Loader）支持 Express、Koa、Webpack支持模板继承与子模板浏览器版本仅 6KB 大小安装npmnpm install art-template --save在浏览器中实时编译template-web.js使用在页面中引入art-template&l

2021-01-09 14:36:41 175

原创 Python面向对象编程--增删改查

1 创建程序文件创建项目目录PersonManagerSystem程序文件如下1）程序主入口文件（一般命名为main.py）2) 人员文件：person.py3)管理系统文件 managerSystem.py2.定义人员类（person.py）class PersonList(object): #默认继承object # 魔法方法 __init__(self)初始化数据 def __init__(self,name,gender,tel): self.n

2020-12-13 20:52:52 821

原创 React Native基础知识讲解

什么是React Native？React Native 是facebook 开源的一套用于开发移动端跨平台App的技术框架其代码托管在github上。为什么要用React Native？传统开发的痛点开发成本低代码复用率高支持动态更新React Native 的优点跨平台低投入高回报性能高支持动态更新安装Android Studio（提供用于为各类 Androi...

2019-01-24 11:29:06 286

原创 mpvue小程序开发注意点

小程序语法缺点（我们为什么要使用vuejs）不能使用npm，使用第三方包的方式太原始需要为小程序单独开发代码，不能和web系统重用开发效率和学习成本（小程序特有语法）mpvue入门npm install --global vue-cli# 创建一个基于 mpvue-quickstart 模板的新项目$ vue init mpvue/mpvue-quickstart my-proj...

2019-01-22 21:19:41 528

原创 Redux基本介绍与Redux项目集成

项目工程化概念理解项目架构设计目录结构定义制定项目开发规范（ESLint规范）模块化，组件化前后端接口规范（错误拦截，loading处理）性能优化，自动化部署（压缩，合并，打包）Redux基本介绍单向数据流：从父组件流向子组件，兄弟组件无法传递数据state： React中的状态，是只读对象，不可直接修改Action：普通对象，用于描述事件行为，改变stateRedu...

2019-01-07 19:19:44 242

原创 react +antd的Table组件如何实现点击表格行选中

onRow设置行属性 Function(record, index)rowSelection 表格行是否可选择，配置项 objectselectedRowKeys是配置项指定选中项的 key 数组，需要和 onChange 进行配合 string[] const rowSelection = { type:'radio', selectedRowKeys:th...

2018-12-31 23:34:55 10486 1

原创 react表格加载之前如何实现loading

将下面代码复制到public/index.html文件里面，将它变成全局的html文件，这样已经生成了全局的dom<div class="ajax-loading" id="ajaxLoading" style="display: none;"> <div class="overlay"></div> <d

2018-12-31 21:42:59 1559

原创 react使用antd组件递归实现左侧菜单导航树

import React from 'react'import { Menu, Icon } from 'antd';import './index.less';import MenuConfig from './../../config/menuconfig'; //导入数据const SubMenu = Menu.SubMenu;export default class NavL...

2018-12-21 19:15:39 2986

原创 react+webpack+antd项目搭建

安装create-react-app clinpm install -g create-react-app创建工程create-react-app my-app进入根目录cd my-app本地服务启动，将会在本地3000端口启动npm run start安装所需插件react-router axios less less-loaderyarn add react-rout...

2018-12-21 14:41:17 740

原创微信小程序流程与开发前准备

1 进入微信公众平台官网https://mp.weixin.qq.com/2 注册微信小程序账号（个人，企业）微信对个人的小程序是很保守的微信公众号包含三类订阅号小程序服务号打开开发者文档https://developers.weixin.qq.com/miniprogram/introduction/index.html3 下载微信开发者工具4 登录小程序账号后台获取ap...

2018-12-19 17:16:28 288

原创在项目中如何使用vuex实现数据共享（二）

如果使用本地存储的话最好用try catch 包起来import Vue from 'vue';import Vuex from 'vuex';Vue.use(Vuex);let defaultCity = '北京';try { if (localStorage.city) { defaultCity = localStorage.city; }} catch (e...

2018-12-14 23:23:55 213

原创在项目中如何使用vuex实现数据共享（一）

安装vuexnpm install vuex --save在src文件夹下创建一个store文件夹在store文件夹下新建一个index.js文件夹import Vue from 'vue';import Vuex from 'vuex';Vue.use(Vuex);export default new Vuex.Store({ state: { city: '北京...

2018-12-14 22:41:07 520

原创 swiper图标轮播示例

<swiper> <swiper-slide v-for='item in pages'> <div class="icon-item" v-for='icon in item'> <div class="iconImg"></div> <sp

2018-12-11 20:40:11 563

原创使用vue-awesome-swiper时没有小圆点，更改样式

data() {return{swiperOption: { pagination: { el: '.swiper-pagination', },}}<style lang="stylus" scoped>//穿透所有在.wrapper下面的.swiper-pagination-bullet-active更改小圆点的背...

2018-12-11 14:45:24 9950

原创移动端适配以及注意点

1. 首先更改index.html里面的meta标签<meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0,maximum-scale = 1.0,user-scalable=no" >2 然后重置css,在main.js里面引入reset.css和border...

2018-12-10 21:05:48 225

原创如何优雅的使用Vant组件库

安装Vantnpm i vant -S引入Vant的第一种方法：导入所有组件（不推荐）在src/main.js进行全局引入。import Vant from 'vant';import 'vant/lib/index.css';Vue.use(Vant);引入Vant的第二种方法：使用 babel-plugin-import (推荐)它会在编译过程中将 import 的写法...

2018-12-06 20:17:47 7995

原创 vue cli 3.0配置

安装新软件包 sudo npm install -g @vue/cli查看是否已经安装vue --version创建新项目vue create vuevant第一个是选择默认配置我们选择第二个，自己配置，按箭头上下键选择，回车，空格键选择会出现下图Babel：将ES6编译成ES5TypeScript：是JavaScript的一个超集，扩展了JavaScript的语法...

2018-12-06 11:05:40 418

原创使用webpack配置环境

webpack主要做什么打包转化优化一首先全局安装webpacknpm install -g webpacknpm install webpack-cli -g初始化项目生成package.json文件npm init在项目中安装webpacknpm install --save-dev webpack查看是否已经安装好webpack了webpack -v...

2018-12-06 00:44:38 139

原创如何利用babel工具将es6语法转换成es5语法

首先创建一个babel文件夹初始化项目会生成一个package.json文件npm init全局安装babel工具npm install -g babel-cli然后安装npm install --save-dev babel-preset-es2015 babel-cli安装完成之后新建.babelrc文件，文件内容如下：babel 要转换的路径 --out-dir ...

2018-11-27 21:30:44 1328

原创 TypeScript基础教程

TypeScript安装npm install -g typescripttsc hello.tsvscode自动编译ts文件tsc --init生成配置文件tsconfig.json,改‘outDir‘:’./js’点击vscode里面的任务-运行任务点击tsc:监视-tsconfig.jsonTypeScript数据类型（ts中定义变量必须指定类型）1. 布尔类型（boo...

2018-10-08 19:23:10 414

原创快速在本地搭建轻量级服务器

1. 全局安装http-servernpm install http-server -g2. cd到你的静态文件目录3. 运行http-server就可以开启web服务http-server -p 8090 -o配置项用途-p要使用的端口-o启用服务器之后打开浏览器窗口-d显示默认列表（默认为true）true/false-a要使用的地址...

2018-09-27 18:04:39 871

原创 Vue中的（computed）计算属性和（watched）侦听属性以及（methods）方法

1. computed 计算属性可用于快速计算视图中显示的属性。这些计算将被缓存，并且只在需要时更新。他的方法不需要在data里面定义它们完全是同步的。 <div class="text"> {{total}} </div>export default { data() { return { a: '我是a', b...

2018-09-26 12:56:45 546

原创 Vue路由传参与取值的两种方式

方式一：params必须用name识别路径 this.$router.push({ name: 'SN', params: { data: '参数', }, });用params获取的值da...

2018-09-25 20:26:15 1573

原创 vue路由的两种模式配置以及history模式下面后端如何配置

hash ——即地址栏URL中的#符号。hash 虽然出现URL中，但不会被包含在HTTP请求中，对后端完全没有影响，因此改变hash不会重新加载页面。history ——利用了HTML5 History Interface 中新增的pushState() 和replaceState() 方法。需要特定浏览器支持history模式，会出现404 的情况，需要后台配置。1、hash模式下，...

2018-09-25 19:17:27 7120

原创 iview的Table如何添加按钮以及操作

<Table border ref="selection" :stripe="true" :columns="columns" width="97%" height="400" :data="data1"> </Table>{ title: '消息状态', // '推送频率',

2018-09-20 15:16:09 14153

原创 iview上传图片

iview上传图片 &amp;amp;lt;Upload ref=&amp;quot;upload&amp;quot; :format=&amp;quot;['jpg','jpeg','png']&amp;quot; action=&amp;quot;http://10.0.0.4:8004/uploadPic&amp;qu

2018-09-19 18:14:47 2173

原创 nodejs基础

特点：单线程，非阻塞I/O，事件驱动 nodejs是一个js的执行环境require表示引包，引包就是引用自己的一特殊功能简单讲解http模块const http = require('http');http.createServer((req, res) =&gt; { res.writeHead(200, { 'Content-Type': 'text/html;c...

2018-09-19 18:09:35 132

原创 JS原型prototype

js是面向对象的语言，但它是基于原型prototype的语言。每个函数都有一个属性prototype，这个属性值是一个对象，默认的只有一个叫做constructor的属性，指向这个函数本身function A{}A.prototype.constructor //ƒ A(){} 指向本身A.prototype.newPerson = function(){console.l...

2018-09-17 10:41:54 391

转载百度坐标（BD09）、国测局坐标（火星坐标，GCJ02）、和WGS84坐标系互转

GitHub地址：https://github.com/wandergis/coordtransform npm地址：https://www.npmjs.com/package/coordtransform 项目主页：http://wandergis.github.io/coordtransform/<!DOCTYPE html><html lang="en">...

2018-09-11 16:52:54 467

原创 iview的时间实时限制

html部分&lt;FormItem prop="messageFrequency" label='消息有效期开始时间：'&gt; &lt;Date-picker type="datetime" placeholder="选择日期和时间" style="width: 200px;disp

2018-09-10 15:20:33 1496

原创 iview表单提交系列问题

1 重置的时候上传图片未清空 <Upload ref="upload" action="http://10.0.0.4:8004/uploadPic"> <Button type="ghost" icon="ios-cloud-upload-outline">上传 </Button> </Upload>

2018-08-29 19:32:13 7184

原创 iview日期控件返回给后台的数据带T

<DatePicker @on-change="formValidate.startTime=$event" v-model="formValidate.startTime"format="yyyy-MM-dd" type="date" placeholder="请选择"></DatePicker>加上@on-change=”formValida

2018-08-28 17:09:25 2309

原创什么是跨域以及如何解决跨域 HTTP访问控制（CORS）

什么是跨域当一个资源从与该资源本身所在的服务器不同的域或端口请求一个资源时，资源会发起一个跨域HTTP请求。浏览器限制从脚本内发起的跨源HTTP请求。 XMLHttpRequest和FetchAPI遵循同源策略。所谓同源是指域名，协议，端口均相同。浏览器执行javascript脚本时，会检查这个脚本属于哪个页面，如果不是同源页面，就不会被执行。如何解决跨域 1跨域资源共享（C...

2018-08-21 19:07:02 1219

原创 ES6数组的常用方法汇总

创建数组方式一const arr = new Array();arr[0] = 'a';arr[1] = 'b';console.log(arr);方式二const arr2 = new Array('a', 'b'); 方式三const arr3 = ['a', 'b'];Array.length遍历数组const arr = [1...

2018-08-20 19:24:47 720

原创工作中常用到的Git命令

Git实用技巧和命令要求命令从远程服务器克隆代码到本地 git clone git@xxx.git 在本地仓库中创建分支 git branch dev(创建分支) git checkout dev(切换分支) git checkout -b dev(创建并且切换分支) 像本地仓库提交代码 1git add . 2git commit -...

2018-08-20 18:37:58 352 1

weixin_43021174的博客