wenbin_ouyang - 博客园

React组件式编程Demo-用户的增删改查

摘要： 1、项目结构项目是基于webpack4, 参考创建基本的webpack4.x项目 2、页面效果初始化效果添加功能通过id删除更新功能 3、代码 package.json { "name": "react-helloworld", "version": "1.0.0", "descript 阅读全文

posted @ 2019-12-13 11:21 wenbin_ouyang 阅读(1695) 评论(0) 推荐(0)

React之this.refs, 实现数据双向绑定

摘要： 1、实现数据双向绑定将input组件与this.state属性绑定，要么是readonly, 要么使用onChange事件；获取input元素的value值，有两种方式： 1） e.target.value 2) this.refs.引用名称 import React from 'react' 阅读全文

posted @ 2019-12-11 14:50 wenbin_ouyang 阅读(1427) 评论(0) 推荐(0)

React事件，修改this.state的值

摘要： 1、React中绑定事件 React中绑定事件格式： onClick = { function } React中绑定事件的标准用法： import React from 'react' export default class Hello5 extends React.Component { con 阅读全文

posted @ 2019-12-11 00:20 wenbin_ouyang 阅读(710) 评论(0) 推荐(0)

windows安装解压版postgresql

摘要：目录： 1、postgresql 解压版下载2、将下载的 postgresql-12.1-1-windows-x64-binaries.zip 解压3、初始化数据库4、启动服务5、连接数据库 6、创建用户并授权 1、postgresql 解压版下载 <--返回目录 2、将下载的 postgresql 阅读全文

posted @ 2019-12-09 10:25 wenbin_ouyang 阅读(2826) 评论(1) 推荐(3)

React组件(组件属性this.state和this.props,css样式修饰组件)

摘要：目录： 1、创建组件的第一种方式 function2、将组件抽离为单独的jsx文件3、省略.jsx后缀，配置webpack设置根目录4、创建组件的第二种方式--使用class关键字创建组件5、组件私有数据this.state(一般使用ajax获取的数据)6、有状态组件和无状态组件7、在组件中使用s 阅读全文

posted @ 2019-12-08 22:44 wenbin_ouyang 阅读(819) 评论(0) 推荐(0)

React使用JSX语法

摘要：目录： 1、在React项目中启用JSX语法 2、在JSX中写js代码 3、使用JSX注意事项 1、在React项目中启用JSX语法 <--返回目录 JSX语法：符合xml规范的js语法 JSX语法的本质：在运行时，转换成React.createElement形式来执行第一步：安装babel插件: 阅读全文

posted @ 2019-12-05 23:56 wenbin_ouyang 阅读(614) 评论(0) 推荐(0)

react-helloword

摘要： 1、在webpack项目中使用react 创建webpack项目步骤见：创建基本的webpack4.x项目 webpack-dev-server 和 html-webpack-plugin的使用 1）运行cnpm i react react-dom -S安装包 react: 创建组件和虚拟DOM，阅读全文

posted @ 2019-12-05 01:04 wenbin_ouyang 阅读(303) 评论(0) 推荐(0)

webpack-dev-server 和 html-webpack-plugin的使用

摘要： webpack-dev-server的作用：自动编译 1、webpack-dev-server的使用 1）cnpm i webpack-dev-server -D 2）在package.json中配置： 3）终端中输入命令：npm run dev 4）浏览器访问http://localhost:80 阅读全文

posted @ 2019-12-04 23:01 wenbin_ouyang 阅读(1124) 评论(0) 推荐(0)

创建基本的webpack4.x项目

摘要： 1、步骤 1）运行npm init -y 快速初始化项目 2）在项目根目录创建src源代码目录和dist产品目录，目录结构 webpack4.x-base |dist |src |index.html |index.js 3）安装webpack: cnpm i webpack webpack-cli 阅读全文

posted @ 2019-12-04 22:09 wenbin_ouyang 阅读(360) 评论(0) 推荐(0)

freemarker页面静态化

摘要： 1、工程结构 2、 Student public class Student { private int id; private String name; private String address; public Student() {} public Student(int id, Strin 阅读全文

posted @ 2019-11-24 20:17 wenbin_ouyang 阅读(340) 评论(0) 推荐(0)

wb.ouyang

导航

公告