分享
是一种美德

MN乐享-乐享生活助手上线

mrnaas阅读(1314)

小程序乐享生活助手上线,暂定第一版,后期会添加更多的生活小助手!

欢迎大家体验及提出意见!

欢迎大家关注公众号:

 

cnpm报错 : 无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\cnpm.ps1,因为在此系统上禁止运行脚本

mrnaas阅读(2872)

 

cnpm : 无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\cnpm.ps1,因为在此系统上禁止运行脚本。有关详细信息,请参阅 https:/go.microsoft.com
/fwlink/?LinkID=135170 中的 about_Execution_Policies。
所在位置 行:1 字符: 1
+ cnpm install
+ ~~~~
    + CategoryInfo          : SecurityError: (:) [],PSSecurityException
    + FullyQualifiedErrorId : UnauthorizedAccess

出现这个问题主要是因为没有执行可用脚本,具体解决办法如下:

1、打开power shell(一定要用管理员身份运行

2、在命令行输入:set-ExecutionPolicy RemoteSigned

3、输入A 回车

4、再次输入cnpm install就可以运行了

 

欢迎大家关注公众号:

MN乐享-公众号自动回复关键字

mrnaas阅读(1388)

本文章主要是收集自己博客中提供大家下载的一些工具及资料的一些链接和验证码,本人会在自己日常工作中遇到的一些好用的工具和资料收藏并及时的更新在自己的博客中及自己的公众号中,同时也希望大家遇到不错的工具可以分享给博主,我来收藏一下并分享给更多的朋友,博客已经开放注册功能,如果时间充足的话你也可以自己上博客去写一下自己的学习笔记亦或者自己的收藏,大家一起学习,分享是一种美德,你会在分享中获得更多的快乐!

关键词】,【标签墙】,【后端】,【前端】,【输入法皮肤】,【JavaScript】,【js】,【SwipePlayer】,【idea激活】,【全家桶激活】,【留言板】,【多开脚本】,【微信多开教程】,【ps2021】,【分流】,【demo

有时候可能会因为工作或者生活中的时间导致自己的公众号和博客不能及时更新,但是只要有时间了就会同步更新一下自己最近的收获!

后期会不定期更新!

大家也可以留言想要哪方面的资料我可以抽时间分享!

欢迎大家关注公众号:

SwipePlayer 轮播组件【react&Preact】

mrnaas阅读(817)

工作中需要做一个轮播选项卡,从网上搜一搜,然后自己做了一些调整,做一下笔记。如果引用需要结合自己的实际情况做微调!

import { h, Component } from 'preact';
import { ImageAttachmentButtons } from '../Messages/ImageAttachmentButtons';
import { createClassName, createspClassName, getAttachmentUrl, MemoizedComponent } from '../helpers';

import styles from './styles.scss';
import imgLURL from './images/left.png';
import imgRURL from './images/right.png';


export class SwipePlayer extends Component {

	state = {
		index: 0,
	}

	_nextImg =  (attachments) => {
		var { index } = this.state;
		if (index === attachments.length - 1) {
		  return
		} else {
		  index++
		}
		this.setState({
		  index: index
		})
	  }

	// 点击播放上一张
	_prevImg = (attachments) => {
		var { index } = this.state;
		if (index === 0) {
			return
		} else {
		index--
		}
		this.setState({
		index: index
		})
	}


	play = () => {
		this.timerId = setInterval(() => {
		  this._nextImg()
		}, 3000)
	  }


	render = ({
		className,
		style = {},
		attachments,
		children,
		attachmentResolver,
		text,
		system,
		quoted,
		me,
		blocks,
		mid,
		rid,
		token
	 }) => (
		<div className={createClassName(styles, 'wrap', {}, [className])}>
			<ul className={createClassName(styles, 'list', {}, [className])}>
			{
					attachments.map((attachment, i) => (
					<li className={createspClassName(styles, 'item', {}, [className], `${i === this.state.index ? 'active' : ''}`)}  key={i}>

						{<ImageAttachmentButtons
						url={attachmentResolver(attachment.image_url)}
						quoted={quoted}
						actions={attachment.actions}
						title={attachment.title}
						rid={rid}
						token={token}
					/>}
					</li>
					))
			}
			</ul>
			{/* <button className={createspClassName(styles, 'btn', {}, [className], 'left')} onClick={() => this._prevImg(attachments)}> */}
				<img className={createspClassName(styles, 'btn', {}, [className], 'left')} onClick={() => this._prevImg(attachments)} src={imgLURL}  />
			{/* </button> */}
			{/* <button className={createspClassName(styles, 'btn', {}, [className], 'right')} onClick={() => this._nextImg(attachments)}> */}
				<img className={createspClassName(styles, 'btn', {}, [className], 'right')} onClick={() => this._nextImg(attachments)} src={imgRURL}  />
			{/* </button> */}
		</div>

	)
}

完整代码如下:

https://pan.baidu.com/s/1M_g2XVjvqMDcfK3EhILWpA

提取码获取方法:

关注公众号发送:【SwipePlayer】

【番外】

其实刚开始打算使用Swiper插件,但是自己已经写出来了功能实现以及项目比较急,所以只能后期去替换吧,抽空会整理一下引入Swiper插件的使用方法。先简单介绍下Swiper:

swipe.js是一个比较有名的触摸滑动插件,它能够处理内容滑动,支持自定义选项,你可以让它自动滚动,控制滚动间隔,返回回调函数等。经常可见使用在移动前端开发中。

使用方法

先安装插件   npm i swiper –save

配置属性预览

startSlide Integer (default:0) - 开始滚动的位置
speed Integer (default:300) - 动画滚动的间隔(秒数)
auto Integer - 开始自动幻灯片(以毫秒为单位幻灯片之间的时间)
continuous Boolean (default:true) - 创建一个无限的循环(当滑动到所有动画结束时是否循环滑动)
disableScroll Boolean (default:false) - 当滚动滚动条时是否停止幻灯片滚动
stopPropagation Boolean (default:false) - 是否停止事件冒泡
callback Function - 幻灯片运行中的回调函数
transitionEnd Function - 动画运行结束的回调函数

java判断字符串是否为空的方法总结

mrnaas阅读(1336)

方法一: 本人推荐的方法,开发中最常用的方法,看起来也比较高大上:

   if(StringUtils.isNotBlank(str))//判断字符串不为空
   或if(StringUtils.isBlank(str))//判断字符串为空
方法二: 比价简单直接的方法

   if(s == null ||””.equals(s));

方法三: 比较字符串长度, 效率高, 比较绕:

   if(s == null || s.length() <= 0);

方法四: 效率和方法三几乎相等, 但出于兼容性考虑,不建议此方法.

   if(s == null || s.isEmpty());

方法五: 这是一种比较直观,简便的方法,而且效率也非常的高,与方法三、四的效率差不多:

   if (s == null || s == “”);

 

 

欢迎大家关注公众号:


——————— 
作者:转角人生 
来源:CSDN 
原文:https://blog.csdn.net/xuanzhangran/article/details/59106831 
版权声明:本文为博主原创文章,转载请附上博文链接!

deepin和UOS sunpinyin 皮肤添加

mrnaas阅读(2423)

喜欢比较简洁的输入法皮肤,所以搜资料,搜文章找到几个朋友做的皮肤,下面我写一下如何添加:

cd /usr/share/fcitx/skin
#这个目录下的文件就是各种皮肤文件

然后可以把对应的你喜欢的皮肤文件放到这里边,以下我分享几个:

链接: https://pan.baidu.com/s/1Bhqj0Gk3VFgjHp-k5lA_ZA

提取码获取方法:

关注公众号发送:输入法皮肤

桌面壁纸的deepin或者uos水印如何去除

mrnaas阅读(3738)

今天更新uos系统后突然发现桌面壁纸新增了 水印logo,于是查了查,有其他人遇到过并解决了,为了方便以后再发生,记录到自己的博客.

具体解决办法如下:

第一种:

cd /usr/share/deepin

找到dde-desktop-watermask.json 文件并复制一份,然后打开dde-desktop-watermask.json

{
    "isMaskAlwaysOn": true,
    "maskLogoUri" : "/usr/share/deepin/uos_logo.svg",(将这一行删除之后保存重启或者注销水印即可删除)
    "maskLogoLayoutAlign" : "center",
    "maskLogoWidth": 128,
    "maskLogoHeight": 48,
    "maskText" : "",
    "maskTextLayoutAlign" : "center",
    "maskTextColor" : "#04d5f7",
    "maskTextFontSize": "22px",
    "maskTextAlign": "center",
    "maskTextWidth": 0,
    "maskTextHeight": 0,
    "maskLogoTextSpacing": 0,
    "maskWidth": 128,
    "maskHeight": 48,
    "xRightBottom": 60,
    "yRightBottom": 98

}

第二种:

cd /usr/share/deepin

将这个目录下的uos_logo.svg删除,重启或者注销即可!

欢迎大家关注公众号:

Vue常用指令001

mrnaas阅读(2144)

Vue.js的指令是指v-开头,作用于html标签,提供一些特殊的特性,当指令被绑定到html元素的时候,指令会为被绑定的元素添加一些特殊的行为,可以将指令看成html的一种属性;

(1)v-text:

数据绑定标签,将vue对象data中的属性绑定给对应的标签作为内容显示出来,类似js的text属性;

(2)v-html:

类似v-text标签,他是将data的属性作为html语法输出,类似js中的innerHtml属性;

(3)v-on:==@ methods:{}

缩写 @
参数:event

给dom添加一个事件监听

 

计数器实例:

<html>

<head>


<meta charset="utf-8">


<meta name="viewport" content="width=device-width, initial-scale=1.0">


<meta http-equiv="X-UA-Compatible" content="ie=edge">


<title>计数器</title>

</head>

<body>

    <div id="app">
    
        <div>

​            <button @click="sub">-</button>

​            <span>{{num}}</span>

​            <button @click="add">+</button>

​        </div>

​    </div>

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>


​    var app = new Vue({

​        el: '#app',

​        data:{

​            num:1

​        },

​        methods:{

​            sub:function(){

​                if(this.num > 0){

​                    this.num--

​                }else{

​                    alert('最小值为0!')

​                }

​            },

​            add:function(){

​                if(this.num < 10){

​                    this.num++

​                }else{

​                    alert('最大值为10!')

​                }

​            },

​        }

​    })

</script>

</body>

</body>

</html>

(4)v-show:

根据表达式的真假来切换所绑定的dom的display属性

(5)v-if and v-else and v-else-if

  • v-if v-if和v-show功能差不多,都是用来控制dom的显隐,用法也一样,只是原理不同,当v-if=”false”时,dom被直接删除掉;为true时,又重新渲染此dom;
  • v-else v-else用来表示v-if=””的else情况
  • v-else-if
综上 if, else, else if,都是用来控制显隐的

v-show 和 v-if 区别:

v-if 删除/添加页面的Dom元素,所v-if 有更高的切换消耗。

v-show切换css的display属性,因此有较高的初始化渲染消耗。

因此:–> 如果需要频繁切换的需求场景v-show比较合适,反之v-if 较好。

(6)v-bind

缩写 :
参数 : attr/Prop (optional)

用于将vue的值绑定给对应dom的属性值

实例 图片切换

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>图片切换</title>
</head>
<body>
    <div id="mask">
        <div>
            <a href="javascript:void(0)" v-show="index!=0" @click="prev">《</a>
            <a href="javascript:void(0)" v-show="index<imgsrc.length-1" @click="next">》</a>
            <img :src="imgsrc[index]" alt="">
        </div>
    </div>
    <!-- 开发环境版本,包含了有帮助的命令行警告 -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
    var app = new Vue({
        el: '#mask',
        data:{
            imgsrc:[
                './images/001.png',
                './images/002.png',
                './images/003.png',
                './images/004.png'
            ],
            index:0
        },
        methods:{
            prev:function(){
                this.index--
            },
            next:function(){
                this.index++
            },
        }
    })
</script>
</body>
</body>
</html>

欢迎大家关注公众号:

Vue学习笔记001

mrnaas阅读(1207)

1、Vue作用域(4个):

  • 全局作用域Vue 应用程序中的全局作用域与任何编程语言中的全局作用域类似,这些变量在应用程序中的任何地方都是可用的。可以把全局作用域看作应用程序作用域,因为它将作用域限制为整个应用程序。
  • 子树作用域大多数时候,全局范围有点像大锤,我们需要一些更精确的东西。子树作用域中的变量作用域是应用程序的特定部分,而不是整个应用程序。此级别的作用域可能是最少使用的,但是在确实需要使用时非常方便。通常,一组组件需要共享很多相同的数据,并且通过props传递数据非常繁琐。
  • 组件作用域更具体一点,组件作用域使变量可用于单个组件。但是这不应该与更具体的实例作用域相混淆。如果一个变量具有组件作用域,那么它就是一个组件的所有实例都可以使用的单个变量。我们可以拥有几个相同的组件,并且它们都能够访问相同的变量。你可能熟悉 JS 中的模块作用域。在单个模块或文件中定义的任何内容都属于相同的模块作用域。由于组件是在单个文件中定义的,所以组件中的所有内容都在相同的模块作用域内。
  • 实例作用域:el挂载点的内部实例作用域是我们可以获得的Vue作用域变量最常见形式,具有实例作用域的任何变量仅可用于组件的特定用法。我们通常将其称为内部状态,有时也称为局部状态。

2、是否可以使用其他选择器:id class 标签 建议使用id,因为id是唯一的

3、可以设置其他的双标签dom元素,不能使用html和body

4、Vue中用到的数据需要定义在data中,可以编写复杂类型的数据

参考文章:https://blog.csdn.net/qq449245884/article/details/105062071

欢迎大家关注公众号: