举个不听话的栗子-CSDN博客

原创 vue $emit $on 之兄弟间通信

Event.$emit('eventName',this.msg);　　　发送数据，第一个参数是事件名，第二个参数是传出的数据Event.$on('eventName',function(msg){}）　　接收数据，第一个参数是事件名，要个$emit的第一个参数保持一致，第二个是传入的数据，在方法里可以将传入的数据进行操作首先要创建一个.js文件创建一个vue实例，例如：bus.jsimport Vue from 'vue'export var bus = new Vu...

2021-01-21 16:10:19 631 1

原创 Object.keys() .... Object 点之后的方法

// 获取对象的key键Object.keys()栗子：var arr = ['a', 'b', 'c'];console.log(Object.keys(arr)); // console: ['0', '1', '2']// 用于将所有可枚举属性的值从一个或多个源对象分配到目标对象Object.assign()栗子：const obj = { a: 1 };const copy = Object.assign({}, obj);console.log(copy); // .

2021-05-06 16:39:26 135

原创移动端

meta标签设置ideal viewport<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">获取手机的宽度varw=window.innerWidth||document.documentElement.clientWidth||document.body.clie...

2021-05-06 16:24:37 138

原创获取当前日期的前三个月

// 获取当前钱三个月的 getThreeMonthBefor() { var resultDate, year, month, date var currDate = new Date() year = currDate.getFullYear() month = currDate.getMonth() + 1 date = currDate.getDate() switch (month) { case .

2021-03-19 16:13:17 765

原创 components---页面中创建组件

<ScreenfullBox @change="click" :isScrollShow="scrollShow"></ScreenfullBox>export default {data() { return { // 是否是只显示tabe scrollShow: false, } }, components: { // 操作全屏的组件 ScreenfullBox: { props: { .

2021-03-05 11:04:50 458 1

原创 vue中mixins的使用方法

混入 (mixin) 提供了一种非常灵活的方式，来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被“混合”进入该组件本身的选项。首先创建一个js文件，例如elTableAdsorbent.jsexport const elTableAdsorbent = { data() { return { count:10 } }, methods: { // 显示页面中所有内容 hand.

2021-03-05 10:48:35 416 1

原创 vue 组件中slot的使用

slot怎么在组件中写入，页面中使用？首先在组件中写入插槽slot标签,要定义name，在引入页面中要这么写 v-slot:name为什么要写name，应该是怕一个组件中写入多个插槽，以便于区分举个栗子:在组件中<div class="mainTit">  <span class="subtitle" v-show="show">{{ title }}</span> <!-

2021-01-21 16:29:56 751

原创 css 去掉双击选中

这是自己写的分页，发现只要是连续点击几次就会发现默认选中，这种状态感觉很不友好发现css是可以解决此问题.userNotSelect{ -moz-user-select:none;/*火狐*/ -webkit-user-select:none;/*webkit浏览器*/ -ms-user-select:none;/*IE10*/ -khtml-user-select:none;/*早期浏览器*/ user-select:none;}这样就感觉就友好很多啦...

2021-01-20 11:03:11 349

原创 vue的$on 和 $emit 兄弟组件间通讯

vue的$on 和 $emit 兄弟组件间通讯创建一个文件bus.js ,在里面new 一个vue实例import Vue from 'vue'export var bus = new Vue()在组件中分别引入，创建的文件vue实例import { bus } from './bus.js'在其中一个组件中进行发送bus.$emit('steps1ToSteps2', { cprojectList: this.tableData})在另个组件中进行接收//两种接收的方式第一种

2020-11-30 11:25:39 475

原创 vue插件瀑布流之 vue-waterfall2

步骤一：安装依赖 npm i vue-waterfall2@latest --save步骤二：main.js中引入import waterfall from 'vue-waterfall2'Vue.use(waterfall)属性Name Default Type Desc height - String 容器高度(height为空监听的是window的滚动事件，不为空则监听容器滚动) col 2 Number 列.

2020-07-29 16:55:41 13378 5

原创 vue应用插件

一、amfe-flexible/postcss-pxtorem——Vue CLI 3 自适应解决方案1-------------安装amfe-flexiblecnpm i amfe-flexible -S配置amfe-flexible//.main.jsimport Vue from 'vue'import App from './App.vue'import route...

2019-10-10 15:30:36 190

原创 vue-wechat-title——微信动态设置标题

安装：npm install vue-wechat-title --save引入：// 设置每个页面的标题//在mian.js中引入作为全局使用import VueWechatTitle from "vue-wechat-title";Vue.use(VueWechatTitle);使用：//在app.vue中的router-view中写入<templ...

2019-09-05 16:03:10 1307

原创微信JS-SDK ——————微信支付

文档链接：https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115JSSDK使用步骤步骤一：绑定域名先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。步骤二：引入JS文件http://res.wx.qq.com/open/js/jweixin-1.4.0.js步...

2019-09-05 15:48:29 778

原创当字符串遇到‘↵’换行符怎么办！！！

str.replace(/(\r\n|\n|\r)/gm, "<br />")举个栗子：let str = "兴趣点：↵1、与带插座圆柱体对应。↵2、逐渐引导幼儿学会自我纠错。↵3、每盒圆柱体的尺寸、颜色不同并可以混合搭建。↵"<div v-html="turn(str)"></div>function turn(data) { r...

2019-07-05 16:09:10 1911

原创微信号,QQ号,手机号正则校验

2019-06-12 11:20:59 1928

原创 mac版的Photoshop

链接:https://pan.baidu.com/s/1c_Y_fYI3_IGaWoTQSvrFwg 密码:znot

2019-03-29 15:52:17 4110

翻译小程序之动态修改页面标题

一：写死的形式在json直接配置：{ "navigationBarTitleText": "标题"}二：动态修改的形式onLoad: function (options) { wx.setNavigationBarTitle({ title: this.data._title }) }　　 ...

2019-01-14 14:04:57 3406

原创 jquery自动添加表格，合并表格中相同文本的相邻单元格

在网上找了找相应的资料，自己写的一个小功能，也许功能不是特别完美，如有意见可以积极的提出来

2018-12-20 16:42:44 356

翻译 vue 中的watch

props: { obj:{ type:Object, default:{name:'lili'} }}watch: { obj: { handler(newName, oldName) { console.log('obj.a changed'); }, immediate: true, dee...

2018-10-30 17:17:05 156

转载强制换行

强制换行 1、word-break: break-all; 只对英文起作用，以字母作为换行依据。 2、word-wrap: break-word; 只对英文起作用，以单词作为换行依据。 3、white-space: pre-wrap; 只对中文起作用，强制换行。禁止换行 white-space:nowrap;...

2018-10-30 16:22:35 2339

原创基于vue的框架有哪些

Vue开发使用的插件 Vux https://doc.vux.li/zh-CN/ VUX（读音 [v’ju:z]，同 views）是基于WeUI和Vue(2.x)开发的移动端UI组件库，主要服务于微信页面。基于webpack + vue-loader + vux可以快速开发移动端页面，配合vux-loader方便你在WeUI的基础上定制需要的样式。...

2018-10-08 14:59:11 7808

原创 jQuery resize() 方法使用

$(window).resize(function(){ $('span').text(x+=1); })定义和用法当调整浏览器窗口大小时，发生resize 事件。resize() 方法触发 resize 事件，或规定当发生 focus 事件时运行的函数;...

2018-10-08 14:52:21 3771 2

原创如果解决图片的居中问题

<div> <img class="box_pic" src="images/version1/about/ico_logo.png" alt="" /></div>.box_pic{ margin: auto; display: table;}这样子图片就可以居中显示啦！！！...

2018-10-08 14:44:40 993 1

翻译禁止调整微信浏览器内字体大小

最近发现在微信浏览器中调整页面的字体大小时，会打乱页面的整个布局，在网上找了找解决的方案，找到了以下此方案，有效的解决了这个问题，我也借鉴过来以便更多的小伙伴解决此类问题出现的问题：1、如果用户在标准情况下，打开页面。再调整字体大小，那么页面依旧正常。　　　　　　2、如果用户先调整了字体大小，再打开页面，页面会变大，一秒之后恢复正常。　　　　　　注：采用loading，可解决2的问...

2018-09-29 11:27:02 3033

翻译 vue 遮罩层阻止默认滚动事件

vue中提供 @touchmove.prevent 方法可以完美解决这个问题。 <div class="child" @touchmove.prevent ></div> vue同时还提供了其他的修饰符：阻止单击事件继续传播：<a v-on:click.stop="doThis"></a> 提交事件不再重载页面： ...

2018-09-29 10:35:19 11232

前端小知识