瑞朋哥的博客

原创 Dart学习 入口 注释 变量 常量 命名规则--002

1.入口方法：main方法，所以yao

原创 Dart学习环境搭建--001

官网是https://dart.dev/Dart环境搭建：要在我们本地开发Dart程序的话首先需要安装Dart Sdk

原创 解决vscode集成“git bash”后的中文乱码问题

1、git目录下搜索gitconfig文件中增加以下内容：[gui] encoding = utf-8[i18n] commitencoding = GB2312[svn] pathnameencoding = GB2312

原创 Argument passed in must be a single String of 12 bytes

错误发生分析及原因使用mongoDB中的ObjectId，通过构造器方式自行封装一个通过id查询数据的函数Error: Argument passed in must be a single String of 12 bytes or a string of 24 hex characters传入的参数必须是一个12字节的字符串或24个十六进制字符的字符串错误就是在前端与后端数据交互的过程中，id长度出现了问题，不满足使用要求，所以报出错误。错误解决在前端对应id传回后端判断之...

原创 数组扁平化及树形数据添加属性

// 原始数据let arr = [{ "label": "费用名称及项目", "id": -1, "children": [{ "label": "名称", "id": -5, "children": [] }, { "label": "项目", "id": -6, "children": [] }] }, { "label": "公式", "id": -2, "children": [] }, { "label": "金额", "id": -3, "children": [] }, { "label.

原创 温故而知新--小程序学习01

数据渲染 /** * 页面的初始数据 */ data: { msg: 'one', list: [ 'vue', 'react', 'mina' ], arr: [{ name: 'abc', age: 18, list: [ 'vue', 'react', 'mina' ] },

原创 mongoose 操作mongodb数据库三

/*db.order.aggregate([ { $lookup: { from: "order_item", localField: "order_id", foreignField: "order_id", as: "items" } },{ ...

原创 Android SDK Tools开发工具安装

下载适合自己电脑版本的Android SDK Tools我是从http://www.androiddevtools.cn/下载的，资源不错，对于不太熟悉的我来说，直接下载最新版安装。下载好之后，双击进行安装。...

原创 Intel x86 Emulator Accelerator(HAXM installer)无法安装

在sdk manager中Intel x86 Emulator Accelerator(HAXM installer)后面显示NOT compatible with windows这个时候可以尝试手动安装Intel x86 Emulator Accelerator(HAXM installer)1、在网上下载后，https://software.intel.com/en-us/artic...

原创 hbuilder 连接夜神模拟器，对app进行模拟器调试

分别启动hbuilder 和夜神模拟器对app进行模拟器调试之前需要安装好android-sdk tools不会安装的请看我的另一篇文章https://blog.csdn.net/qfxlw/article/details/83098051和https://blog.csdn.net/qfxlw/article/details/83098158，在夜神模拟器安装目录下/bin下启动cm...

原创 hbuilder使用mui进行移动app开发，真机调试

原创 React学习之旅----安装脚手架

npm i yarn -g全局安装yarnnpm install -g create-react-app全局安装脚手架create-react-app react01建立第一个项目，最好已经全局安装了yarn安装了node高版本后可以直接npx create-react-app react02是新的react建立项目方法，将来使用，目前还是旧方法好之后cd react02（项目文件...

原创 React学习之旅----新建组件

react的组件有两种写法：import React from 'react';class News extends React.Component { constructor(props) { super(props) // 用于父子组件传值 } render () { return ( <div> <ul>...

原创 React学习之旅----事件方法及改变this指向

import React, { Component } from 'react';import '../assets/css/index.css'// react绑定属性注意点// class要换成className// for 要换成htmlFor// styleclass Home extends Component { constructor() { super()...

原创 React学习之旅----引入图片

import React from 'react';// 引入本地图片，需以组件的形式引入，而远程图片则不需要import logo from '../assets/images/logo.svg';class News extends React.Component { constructor(props) { super(props) // 用于父子组件传值 thi...

原创 React学习之旅----循环数据

import React from 'react';// 引入本地图片，需以组件的形式引入，而远程图片则不需要import logo from '../assets/images/logo.svg';// 组件名称，类首字母必须大写class News extends React.Component { constructor(props) { super(props) //...

原创 React学习之旅----获取自定义属性

获取自定属性，在小程序中可能更常用，在React中同样也是可以获取的，看实例import React, { Component } from 'react';class Event extends Component { constructor(props) { super(props) this.state = { title: '事件对象练习' ...

原创 React学习之旅----获取表单输入的值，双向绑定

react中实现双向绑定input输入框值import React, { Component } from 'react';class Event extends Component { constructor(props) { super(props) this.state = { title: '事件对象练习', username: '' ...

原创 React学习之旅----实现类似vue的数据双向绑定

react没有数据的双向绑定，但可以用过一些方法实现：import React from 'react';class TodoList extends React.Component { constructor(props) { super(props) this.state = { name: 'React实现数据双向绑定' } } inp...

原创 Sass环境安装的一波三折

今天看大地老师的教学视频，需要安装sass环境，那就跟着教程来呗，啊，于是，一波bug来袭，费了老大劲，终于是搞定了。首先：我们找到sass中文网https://www.sass.hk/install/，按照教程来，下载了ruby安装包，https://rubyinstaller.org/downloads/下载合适自己系统版本的安装包，此处要注意：勾选Add Ruby executabl...

原创 hbuilder 自动编译sass环境配置

原创 React学习之旅----表单录入

import React, { Component } from 'react';/*约束性和非约束性组件: 非约束性组:<input type="text" defaultValue="a" /> 这个 defaultValue 其实就是原生DOM中的 value 属性。 这样写出的来的组件，其value值就是用户输入的内容，React...

原创 阿里巴巴图标库

阿里巴巴图标库http://www.iconfont.cn/进行搜索，下载我们需要的图标即可使用。登陆之后，即可下载

原创 前端小技巧*小知识

font-size: 62.5%; /* 根元素是10px; 16*62.5%=10 默认在pc端根元素会解析成12px */在pc端最小为12px，所以2rem为24px,而在移动端则为20px

原创 React学习之旅----Todolist

import React from 'react';class TodoList2 extends React.Component { constructor(props) { super(props) this.state = { list: [ { title: '录制ionic', checked: ...

原创 React学习之旅-----TodoList本地存储版

import React from 'react';class TodoList2 extends React.Component { constructor(props) { super(props) this.state = { list: [ // { // title: '录制ionic', // ...

原创 React学习之旅----TodoList localstorage本地存储完善版

封装storage。jsvar storage = { set (key,value) { localStorage.setItem(key, JSON.stringify(value)) }, get (key) { return JSON.parse(localStorage.getItem(key)) }, remove (key) { re...

原创 React学习之旅----父子组件传值

父组件import React from 'react'import Header from './Header'import Footer from './Footer'class Father extends React.Component { constructor(props) { super(props) this.state = { titl...

原创 React学习之旅----defaultProps与propTypes

import React from 'react'import PropTypes from 'prop-types';class Header extends React.Component { constructor(props) { super(props) this.state = { title: '头部组件' } } getFath...

原创 React学习之旅----axios与fetch-jsonp

父组件import React from 'react'import Header from './Header'import Footer from './Footer'import Axios from './Axios'import FetchJsonp from './FetchJsonp'class Father extends React.Component { c...

原创 React学习之旅----生命周期函数

app.jsimport React, { Component } from 'react';// import logo from './assets/images/logo.svg';// import './assets/css/App.css';// 引入Home组件// import Home from './components/Home'// import News...

原创 React学习之旅----react-router

app.js/* react路由的配置： 1、找到官方文档 https://reacttraining.com/react-router/web/example/basic 2、安装 cnpm install react-router-dom --save 3、找到项目的根组件引入react-router-dom import { ...

原创 React学习之旅----动态路由传值及get传值

app.js/* react路由的配置： 1、找到官方文档 https://reacttraining.com/react-router/web/example/basic 2、安装 cnpm install react-router-dom --save 3、找到项目的根组件引入react-router-dom import { Browse...

原创 React学习之旅----项目小实例----无人点餐一----列表页渲染

App.js/* react路由的配置： 1、找到官方文档 https://reacttraining.com/react-router/web/example/basic 2、安装 cnpm install react-router-dom --save 3、找到项目的根组件引入react-router-dom import { BrowserR...

原创 React学习之旅----项目小实例----无人点餐二---详情页渲染

App.js/* react路由的配置： 1、找到官方文档 https://reacttraining.com/react-router/web/example/basic 2、安装 cnpm install react-router-dom --save 3、找到项目的根组件引入react-router-dom import { BrowserR...

原创 React学习之旅----项目小实例----无人点餐二---js控制路由跳转

/*实现js跳转路由：https://reacttraining.com/react-router/web/example/auth-workflow1、要引入Redirect import { BrowserRouter as Router, Route, Link, Redirect, withRouter } from ...

原创 React学习之旅----项目小实例----无人点餐二---嵌套路由

App.js/* react路由的配置： 1、找到官方文档 https://reacttraining.com/react-router/web/example/basic 2、安装 cnpm install react-router-dom --save 3、找到项目的根组件引入react-router-dom import { BrowserR...

原创 React学习之旅----项目小实例----无人点餐二---路由模块化-中小型项目

routes数组配置动态路由表import React, { Component } from 'react';import logo from './logo.svg';import './App.css';import { BrowserRouter as Router, Route, Link } from "react-router-dom";import Home from...

原创 React学习之旅----项目小实例----无人点餐二---路由模块化-大型项目

App.jsimport React, { Component } from 'react';import logo from './logo.svg';import './App.css';import { BrowserRouter as Router, Route, Link } from "react-router-dom";import './assets/css/inde...

原创 React学习之旅----使用优美的框架Antd

create-react-app react05cd react05npm install react-router-dom axios url antd -Syarn start启动项目后，在编辑器中打开修改src/App.css，在文件顶部引入antd/dist/antd.css。全局引入对之后的性能优化有些累赘。@import '~antd/dist/antd.c...