四种写法 1. <template> <div> <h1>组件1</h1> <button @click='count++'>+1</button> <button @click='count--'>-1</button> <br /> <button @click='add()'>+1</button> <button @click='sub()'>-1</button> <h2 :style='styles.box' v-text...

Electron 简介  跨平台技术：做桌面应用 Electorn / NW.js Electorn 本质上是 Node.js + 谷歌浏览器的内核，所以它可支持election代码逻辑，还可以渲染Web页面。 桌面应用技术栈：Electorn是壳子，在这个壳子里面可以使用任意的web前端技术（jQuery/Vue/React/Angular） 虽然Electron中有浏览器的内核，但没有CORS同源策略，所以在electron开发中，可以直接调接口。  搭建Electron环境 mkdir electron-app cd electron-app npm init cnpm i electr...

// data中 设置全局变量 // app.js taroGlobalData = { navHeight: '', navTop:'' } componentDidMount () { let menuButtonObject = wx.getMenuButtonBoundingClientRect(); wx.getSystemInfo({ success: res => { let statusBarHeight = res.statusBarHeight, navTop = menuButtonObject.top,//胶囊按钮与顶部的距离 navHeight = status...

<ScrollView className='scrollview' scrollX // 开启横向需要加额外样式 详细见文档 // http://taro-docs.jd.com/taro/docs/components/viewContainer/scroll-view/ scrollWithAnimation ... scrollIntoView={tag} // 核心 对应数据中的id，进行滚动 > { list.map((ele,index)=>{ return( <View onClick={()=>handleClick(ele, index)} k...

reducers actions index(store)  // todo.js import produce from 'immer' import { TODO_ADD,TODO_STATUS,TODO_DEL,TODO_EDIT } from '../actions' const initState = { list:[ {id:1,status:0,task:'吃饭'}, {id:2,status:0,task:'睡觉'}, {id:3,status:1,task:'游戏'}, {id:4,status:1,task:'打豆豆'} ] } export default (state=...

dva  // store import { getUserList } from '../services/user' export default { namespace:'user', state: { userList:[] }, // 一加载就执行 subscriptions:{ }, reducers:{ updateUserList(state, { payload }){ return { ...state, userList: payload } } }, effects:{ *toGetUserList({ payload },{ call, put }){ console...

"tabBar": { "custom": true, ... }  <!--custom-tab-bar/index.wxml--> <view class="tab-bar"> <view class="tab-bar-border"></view> <view wx:for="{{list}}" wx:key="index" class="tab-bar-item" data-path="{{item.pagePath}}" data-index="{{index}}" bindtap="switchTab"> <imag...

组件库的国际化 import { ConfigProvider } from 'antd' // 引入语言包 import zhCN from 'antd/lib/locale/zh_CN'; import enUS from 'antd/lib/locale/en_US'; const langs:any = { 'zh-CN':zhCN, 'en-US':enUS } // 注入 <ConfigProvider locale={langs[lang]}> <System /> </ConfigProvider>    react-intl 国际化配置 i...

// 学习资源： // 1、阮一峰TS教程：http://ts.xcatliu.com/ // 2、TS官网手册：https://www.typescriptlang.org/docs/handbook/intro.html // 3、TS中文网：https://www.tslang.cn/ import { type } from "os" import { pathToFileURL } from "url" import { useState } from "_@types_react@16.14.21@@types/react" import { Col } from "_antd@4...

1.reducers(user.js) // 依赖 import { createAsyncThunk, createSlice, PayloadAction } from '@reduxjs/toolkit'; // 一些api方法 import { fetchLogin, fetchUserInfo } from '../../api'; // 可共享的子store可共享数据 const initialState:any = { token: localStorage.getItem('token'), userInfo: {}, roleInfo:{}, menulist:[] } //...

let obj = {}; arr = arr.reduce((cur,next) => { obj[next._id] ? "" : obj[next._id] = true && cur.push(next); return cur; },[]) //设置cur默认类型为数组，并且初始值为空的数组  arr.filter(function (item, index, arr) { // 当前元素在原始数组中的第一个索引==当前索引值，否则返回当前元素 // arr.indexOf() //只第一次出现的位置 只返回一次 return arr.indexOf(item)...

redux 架构 1、创建传统的react+redux架构环境 create-react-app react-admin 自行安装redux、redux-thunk、react-redux、immer并设计架构（不支持TS） 2、创建react+redux的TS环境 create-react-app react-admin --template typescript 自行安装redux、redux-thunk、react-redux、immer并设计架构（支持TS和ES6） 3、创建react+redux的TS环境（最佳实践） create-react-app react-admin --te...

import React, { useState, useEffect, useReducer } from 'react' import { ReactReduxContext } from 'react-redux' import store from '@/store' // store.getState() 用于获取store中所有的state // store.subscribe() 用于添加一个change事件，监听store变化 // store.dispatch() 用于派发一个action function myconnect1(mapStateToProps, mapDis...

html,body{ height: 100%; overflow:hidden; overflow-y: scroll; } body::-webkit-scrollbar{ width: 0; height: 0; }