- 博客(28)
- 收藏
- 关注
原创 harmonyOS学习笔记之@Provide装饰器和@Consume装饰器
Provide和@Consume,应用于与后代组件的双向数据同步,应用于状态数据在多个层级之间传递的场景。不同于@State/@Link装饰器修饰的 父子组件之间通过命名参数机制传递,@Provide和@Consume摆脱参数传递机制的束缚,实现跨层级传递。@Consume装饰的变量是在后代组件中,去“消费(绑定)”祖先节点提供的变量。@Provide和@Consume通过相同的变量名或者相同的变量别名绑定时,@Provide修饰的变量和@Consume修饰的变量是。然后点击"我是父组件"文字。
2023-12-08 17:03:04 899
原创 harmonyOS学习笔记之状态修饰器@state,@prop,@link
1.@Link装饰的变量和父组件构建双向同步关系的状态变量,父组件会接受来自@Link装饰的变量的修改的同步,父组件的更新也会同步给@Link装饰的变量。1.@State装饰的变量拥有其所属组件的状态,可以作为其子组件单向和双向同步的数据源. 当其数值改变时,会引起相关组件的渲染刷新.2.@Prop装饰的变量是可变的,但修改不会同步回父组件。
2023-12-06 18:37:51 1212
原创 harmonyOS学习笔记之@Styles装饰器与@Extend装饰器
自定义样式函数使用装饰器可以定义在组件内或全局,内部优先级>外部,内部不需要function,外部需要function定义在组件内的@styles可以通过this访问组件内部的常量和状态变量,可以在@styles里通过事件来改变状态变量弊端:只支持通用属性和通用事件 不能传参。
2023-12-03 16:45:55 764
原创 npm install总是卡住不动或者到最后不动,解决问题方法,npm淘宝镜像源最新
最近在使用npm install的时候总是出现卡住不动的情况 后来排查了一下问题 发现淘宝镜像源不是原来的https://registry.npm.taobao.org这个了。为了方便大家,我直接讲最近的更新指令放到下边,大家一键复制就好。淘宝镜像源应该换成以下。查看是否更新正确指令。
2023-08-21 02:25:17 10928 20
原创 截取url中的参数并转化为对象
截取url中的参数并转化为对象有这样一个字符串"http://www.baidu.com?key=1&key=1&key=3&key=4&name=test1&name=test2&name=test3&c#&city=%E6%9D%AD%E5%B7%9E&city=%E5%8C%97%E4%BA%AC",要求转化成 {“key”:[1,1,3,4],“name”:[‘test1’,‘test2’,‘test3’],“c”:’ ',
2022-05-13 07:25:39 654
原创 Node.js+express解决vue项目history打包后出现的刷新白屏问题 ----connect-history-api-fallback
Node.js+express解决vue项目history打包后出现的刷新白屏问题 ----connect-history-api-fallback首先npm对应的中间件npm install --save connect-history-api-fallbackapp.js// 引入connect-history-api-fallback中间件const history = require("connect-history-api-fallback")// 使用app.use(hi
2022-05-11 10:40:39 1168
原创 nodejs之express路由分级
nodejs之express路由分级当然,这是按照我的需求npm的包,可以根据自己的需求npm包,不过有几个是必须的,我会进行标注首先新建一个文件夹,npm init -yes初始化expressnpm install express --savebody-parser获取前端传递过来的数据npm install body-parser --savemd5加密npm install md5 --savemysql 连接数据库,这里可以是其它的数据库,比如MongoDB数据库npm
2022-05-03 07:59:21 964
原创 nodejs之fs模块
nodejs之文件操作fsfs模块是nodejs官方提供的、用来操作文件的模块首先要导入fs模块const fs = require('fs')读文件接下来,我们进行文件读取操作const fs = require('fs')let buffer = fs.readFileSync("./aaa.txt")console.log(buffer)打印结果如下,打印出来的是二进制buffer类型的数据若想打印出原文则需要进行如下操作const fs = require("fs")
2022-05-02 15:35:46 2498 4
原创 nodejs之koa2框架快速搭建服务器
nodejs之koa2框架快速搭建服务器首先新建一个文件夹koa2-test01,然后下载对应的资源包1.koa2,koa2框架必须npm install koa2 --save2.koa-router,用于配置路由npm install koa-router --save3.koa-static,用于静态资源管理npm install koa-static --save4.mysql,用于连接数据库npm install mysql --save5.koa2-cors,用于解决
2022-04-30 05:26:39 1493
原创 Git常用命令
Git常用命令命令作用git config --global user.name “runoob”设置提交代码时用户的用户名git config --global user.email test@runoob.com设置提交代码时用户的邮箱git init使用当前目录作为Git仓库,初始化(这时会生成一个.git目录)git init newrepo指定目录作为Git仓库,初始化后会在newrepo目录下出现.git目录git add 文件名指定文件添
2022-04-20 14:16:59 179
原创 git安装教程
git安装教程点击安装地址点击后按照如下步骤操作先点击Downloads然后根据自己电脑的实际情况选择需要安装的系统,由于我的电脑是windows系统,所以我选择的windows,已以windows系统为例:然后选择64位[64-bit Git for Windows Setup.],若您的电脑位32位的请选择 [32-bit Git for Windows Setup.]然后双击刚刚下载好的安装包,点击next选择安装的目录,然后next接下来勾选这一部分即可,next下面这
2022-04-20 13:40:49 372
原创 vue写一个元素的拖拽效果,canvas元素的获取以及拖拽元素,echarts获取元素进行拖拽以及页面内修改宽高样式
废话不多说,直接开始吧首先我们先新建一个vue项目,这里我相信大家都知道怎么新建vue项目这里我就直接上代码吧,首先我先用canvas元素做示例吧tuozhuai.vue<template> <div> <button @click="getCanvas">点击生成折线图</button> <canvas @mousedown="move" @mouseout="suo" id="myCa
2022-03-08 23:31:43 2242 2
原创 css+js实现手风琴下拉菜单效果
想想到现在已经有一段时间没有更新了,前一段时间忙着面试,过一段时间我会把我的面试用来复习的面试题整理整理发出来下面,我们来用css+js实现手风琴下拉菜单效果,话不多说,直接上代码<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" />
2022-03-01 21:53:32 1973 2
原创 Web前端面试题:浅拷贝与深拷贝,并且用递归实现深拷贝
浅拷贝与深拷贝JS数据类型首先我们要先了解JS的数据类型,JS数据类型分为"基本数据类型"和"引用数据类型",如下标基本数据类型引用数据类型number常用(Obkect,Function)stringbooleanundefinednullsymbol(ES6新增)BigInt(ES10新增)内存然后我们继续了解内存,基本上所有编程语言的内存分区都是一样的.注意,我这里说的是基本上,这里是我的理解,大家不要误解啊.内存是
2022-02-22 18:33:25 681
原创 React Native应用中的样式
React Native应用中的样式RN中样式与CSS名称类似,但是本质上不同 —— RN应用中没有浏览器内核!!!例如:RN中的组件不分“行内”、“行内块”、“块级”;所有的容器默认都使用“弹性布局(纵向)”。RN组件可以使用标准CSS中绝大部分的属性,但是需要注意如下特点:1、组件没有class属性,只有style属性,且必须绑定为“属性对象”,例如:style={ obj };2、RN样式属性对象名全部采用小驼峰命名法,例如:borderLeftWidth;3、RN中的尺寸没有单位,都是指
2022-02-22 01:02:13 989
原创 React Native的概述,React Native的优缺点,React Native开发/运行环境的搭建
React Native概述React是一个构建用户界面的JS框架,实现了数据的响应式和组件化开发,本身既可以用于Web网站项目,也可以用于创建移动端App项目.相较于Vue.js在移动端只能构建WebApp,React生态系统中有一个可以构建"真正原生App"的扩展----React Native,可以说:“RN是React生态圈可以傲视其它对手的绝对功臣”.RN可将JS编译成Java/OC语言 目前最新版本是0.67React Native的优缺点优点1.RN可将标记元素转化为真实的原生UI
2022-02-22 00:56:06 22205 7
原创 验证码----svg-captcha
验证码----svg-captcha首先找或者新建一个空文件夹,下面是我新建的空文件夹然后npm验证码svg-captcha模块npm i --save svg-captcha相信各位都知道一个node项目还要继续引入什么模块吧,可能有刚刚接触nodejs的小伙伴,我还是将需要引入什么模块展示到下面吧npm i expressnpm i body-parser然后再yanzhengma目录下新建一个public文件夹,用来存放静态资源,然后在public文件夹下新建一个captcha.h
2022-02-20 02:56:05 5664 6
原创 vant-UI组件的样式穿透----即vant-UI组件中的部分样式无法修改问题
相信大家使用vant组件时,总有一些UI组件无法满足自己的样式,修改css样式的时候还是无效的。css一般都会使用sass或者less,当在style标签加了scoped后,想要修改的样式就不会起作用,即便加上"!important"都不会起作用例如:当我们想要修改头部导航栏的样式<template> <div> <!-- 头部导航栏 --> <van-nav
2022-02-18 18:59:14 3948 2
原创 React中的列表渲染
React中的列表渲染Vue.js中使用v-for 实现模板中的列表项循环渲染;小程序中使用 wx:for 实现模板中的列表项循环渲染;React中没有模板(即不需要v-for),也没有指令系统(即没有提供类似的机制)。方法1:for循环遍历import React, { Component } from 'react'export default class App extends Component { // 假设服务器端返回如下 state={books:['巴黎圣母院','悲惨世界
2022-02-17 19:35:28 2224
原创 React 应用中的异步数据请求----fetch,以及fetch的优缺点
React 应用中的异步数据请求----fetch与Vue.js一样,React官方也没有提供服务器端接口异步请求方案;可以使用第三方的axios模块,或者H5新增的原生技术:fetch(抓取)---- 有望取代XHR使用fetch发起GET请求:fetch(url) .then( res=>res.json() )//res就是完整的响应消息;res.body是流对象 .then( data=>console.log(data) ) .catch( err=>consol
2022-02-17 19:22:20 2732
原创 React 组件的生命周期函数----钩子函数
Vue.js中组件有如下生命周期函数:beforeCreate / craeted / beforeMount / mounted / beforeUpdate / updated / beforeDestroy / destroyed小程序中组件有如下生命周期函数:onLoad / onShow / onReady / onHide / onUnloaduni-app中有如下生命周期函数:应用级: onLaunch / onShow / onHide页面级: 同小程序组件级: 同Vue.js
2022-02-17 18:35:07 1460
原创 React中的条件渲染
React中的条件渲染Vue.js中使用v-if/v-else实现模板中的条件渲染;小程序中使用wx:if/wx:else实现模板中的条件渲染;React中没有模板(即不需要v-if),也没有指令系统(即没有v-if)。——条件渲染需要手工实现有四种渲染方式好了,上代码方法1:创建判断函数上面的代码实现为此方法f1(){ if(){ return JSX}else return JSX }}{this.f1()}//快捷输入代码块rccimport React, { Com
2022-02-17 11:17:41 1449
原创 React事件处理方法中this指向为undefined的四种解决方案
React事件处理方法中this指向为undefined的四种解决方案:话不多说,先上代码如图所示:点击’-‘按钮数字减一,并打印出当前数字,点击’+'按钮数字加一,并打印出当前数字<div id="root"></div><script src="js/react.development.js"></script><script src="js/react-dom.development.js"></script><
2022-02-16 16:14:46 2147
原创 CSS文本两行或多行,超出用省略号(...)表示
废话不多说,直接上代码<div class="line style"> 内容部分内容部分内容部分内容部分内容部分内容部分内容部分内容部分内容部分内容部分内容部分内容部分内容部分内容部分内容部分内容部分内容部分内容部分内容部分内容部分内容部分内容部分内容部分内容部分内容部分</div><style> .style{ width:200px; }</style>此时的效果图文本超出一行用省略号(…)显示//一行显示.line{ wh
2022-02-11 11:54:32 17778
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人