第一次尝试React+antd,发现果然不愧是传说中的坑货,一个又一个坑.必须要记录. react + antd,都是最新版本,使用npm和yarn各种add,build,start 1. 资源文件,图片文件,路径在build之后会不能用 我们希望的是http://xxxxxxx/AAA/img/XX.png 但build之后给出的是http://xxxxxxx/static/media/XX.png 解决方案: node_modules -> react-scripts -> config

最近在学习微信小程序时遇到了个问题:官方的背景音乐的api实例代码中的音乐src不管用(可能有期限,后面的方法获取的src同样可能有期限),因此本人只能自己去寻找办法获取src,现将方法记录在下面.(官方实例代码如下) const backgroundAudioManager = wx.getBackgroundAudioManager() backgroundAudioManager.title = '此时此刻' backgroundAudioManager.epname = '此时此刻' b

一.概述 create-react-app 是业界最优秀的 React 应用开发工具之一,本文会尝试在 create-react-app 创建的工程中使用 antd 组件,并自定义 webpack 的配置以满足各类工程化需求. 1.1.安装和初始化 我们需要在命令行中安装 create-react-app 工具,你可能还需要安装 yarn. npm install -g create-react-app yarn 然后新建一个项目 create-react-app antd-demo 工具会自动

1.安装.构建 # 全局安装 npm install -g create-react-app # 构建一个my-app的项目 npx create-react-app my-app cd my-app # 启动编译当前的React项目,并自动打开 http://localhost:3000/ npm start 2.项目目录 //默认 ├── package.json ├── public # 这个是webpack的配置的静态目录 │ ├── favicon.ico │ ├── index.ht

1.页面载入完毕响应事件所谓页面载入完毕是指DOM元素载入就绪了,能够被读取和操作了.①jQuery中的$(doucument).ready()事件ready(fn)是jQuery事件模块中最重要的一个函数.这个方法可以看作是对window.onload注册事件的替代方法.通过使用这个方法,可以在DOM载入就绪时立刻调用所绑定的函数,而几乎所有的javaScript函数都是需要在那一刻执行. ready(fn) 返回值:Object 参数-fn:要在DOM载入就绪时执行的参数Function 当

dragstart drag dragend dragenter dragover dragleave drop   前端框架层出不穷,网页上的效果越来越绚丽,制作绚丽的效果的成本越来越低,其中有种拖拽的效果是十分常见并且实用的. 其实手机上的使用已经非常频繁,举个例子,用手指选中一张图片,然后将图片拖到回收站,这就是一个完整的拖拽过程.细分一下,大致可以分为如下几个步骤: 首先,选中目标:然后拖动目标:最后在指定区域释放目标. 在javascript中有专门为这个过程设置的事件, 如果这种方式

--day01--王建立QQ:2529866769今天的内容:一.计算机的框架什么是操作系统?(汽车)加油系统 油门 用户跟加油子系统交互的窗口.(接口)方向系统 方向盘 用户跟方向系统的交互接口.导航系统 ...汽车的操作系统有很多的子系统来完成.这些子系统互相协调工作,达到用户的目的.操作简练.效率高.安全性比较高.... 接口 多个子系统 每个子系统负责单一的工作.操作环境 驾驶员位置 是不是驾驶员直接控制汽车的硬件?通过接口间接控制硬件的. 看不见的 透明框架 组件操作系统管理硬件并且为

一.基于TCP传输层的编程模型 TCP是面向连接的,安全可靠的. 三次握手 服务器端编程模型 .创建一个用于网络通讯的设备 通讯端点 socket() #include <sys/types.h> #include <sys/socket.h> int socket(int domain, int type, int protocol); 功能:创建一个用于通讯的端点 参数: domain: AF_INET:应用于IPV4地址家族的 AF_INET6:应用于IPV6地址家族的 ty

前提:本文基于Linux系统下的学习 服务器端 1 创建通讯端口,返回socket设备的文件描述符 sfdsocket(2)#include <sys/types.h> /* See NOTES */#include <sys/socket.h>int socket(int domain, int type, int protocol);功能:创建一个通讯端点参数:domain:AF_INET IPv4 Internet protocols ip(7)AF_INET6 IPv6 I

Ory Kratos 为用户认证与管理系统.本文将动手实现浏览器(React+AntD)的完整流程,实际了解下它的 API . 代码: https://github.com/ikuokuo/start-ory-kratos 了解 Kratos 获取代码 git clone -b v0.7.0-alpha.1 --depth 1 https://github.com/ory/kratos.git 查看 API go-swagger 查看: cd kratos swagger serve -F=sw

Atitit. IE8.0 显示本地图片预览解决方案 img.src=本地图片路径无效的解决方案 1. IE8.0 显示本地图片 img.src=本地图片路径无效的解决方案1 1.1. div来完成 .filter1 1.2. 如果是本地html,好像用相对路径呀不行2 1.3. URL.createObjectURL ( ma sida)2 1.4. Css 背景(吗四大)2 2. 这是Data URI scheme.2 3. --code2 4. 参考2 1. IE8.0 显示本地图片 im

最近空余时间比较多,自己想学习react跟移动端的东西,就选用了antd-mobile库,框架搭好开发过程中遇到个问题,里面绑定的点击事件无效,不仅是antd自带的按钮无效,原生button点击也没反应,网上找了一大堆没有好的解决方案.在调试过程中发现 原来是我在设置底部导航的时候,把内容部分遮挡了,所以肯定点击没反应,解决方案把底部导航加个z-index:-1就可以了. 总解:发现问题的时候不能轻言放弃,多想想问题出线的可能,说不定就会有新的思路.

/********** 无效 ***************/ <script type="text/javascript" src=""> function ok() { alert('ok'); } ok(); </script> /********** 无效 ***************/ js/test.js: function ok() { alert('ok'); } index.html: <script type=&q

//安装babel-plugin-import 第一步:npm install babel-plugin-import --save第二步:暴露webpack.config.js运行:npm run eject第三步:在webpack.config.js中的module下的oneOf数组里加入下面代码:  {//ES6.JSX处理               test: /(\.jsx|\.js)$/,               exclude: /node_modules/,        

做了个验证码功能,需要做个点击改变验证码图片的功能,使用js改变img的src,代码如下 $("#cerificationCodeImg").attr("src","common/image.jsp"); image.jsp是用来生成验证码图片的,chrome下没有问题,IE下图片没有刷新,FF下也没有.搜索答案,在stackoverflow上找到了答案.链接如下:Dynamically change image src using Jquery

1.src/models 在 Ant Design Pro 中,一个完整的前端 UI 交互到服务端处理流程是这样的: 1.UI 组件交互操作: 2.调用 model 的 effect: 3.调用统一管理的 service 请求函数: 4.使用封装的 request.ts 发送请求: 5.获取服务端返回: 6.然后调用 reducer 改变 state: 7.更新 model. // model { namespace: String, // 命名空间 state: Object, // 状态 r

问题描述 实现一个折叠面板点击展开,但是必须点击两次才能展开,第一次无效 <a-collapse-panel v-for="(item, index) in dataMap" :key="index" :show-arrow="false" > <p>{{ text }}</p> <template slot="header"> {{ item.name }}</templ

问题代码: const tempFieldsValue = this.form.getFieldsValue() Object.keys(tempFieldsValue).map((k) => { if(typeof(tempFieldsValue[k]) === 'string' && tempFieldsValue[k].indexOf('---') !== -1) { this.form.setFieldsValue({ k: undefined }) } }) 原因是 &qu

antd 的 Tree 控件没有提供点击展开的功能,只能通过左边的三角形实现展开和收起,没办法只好自己实现这个功能. 先看效果 如图实现的是类似 Mac 文件目录形式的结构,有箭头代表是个文件夹,点击展开文件夹,点击外层文件夹可以收起整个文件夹. 首先根据服务器返回的 Json 数据生成树形结构 const data = { name: "root", children: [{ name: "a", value: "/a", children:

React框架已经火了好长一段时间了,再不学就out了! 对React还没有了解的同学可以看看我之前的一篇文章,可以快速简单的认识一下React.React入门最好的实例-TodoList 自己从开始接触react一窍不通,到慢慢的似懂非懂,通过各种途径学习也有一阵了.学习过程中还会接触到很多新的东西,比如ES6.webpack,过程艰辛谁人懂,见坑填坑慢慢来.今天把学习过程过滤了一下,只说项目实际需要用的东西,总结了一套能看到的东西,分享给大家,希望能让读者少踩一些坑! 本文看点 实际项目效果

在做的过程中,发现了一个很简单却又很多人应该碰到的问题,设置Z-INDEX属性无效.在CSS中,只能通过代码改变层级,这个属性就是z- index,要让z-index起作用有个小小前提,就是元素的position属性要是relative,absolute或是fixed. 1.第一种情况(z-index无论设置多高都不起作用情况): 这种情况发生的条件有三个: 1.父标签 position属性为relative: 2.问题标签无position属性(不包括static): 3.问题标签含有浮动(f