mpvue小程序快速上手指南
需要了解一些原生小程序开发流程,主要是接口调用方式和目录结构。
安装1234567891011# 全局安装 vue-cli$ npm install --global vue-cli# 创建一个基于 mpvue-quickstart 模板的新项目$ vue init mpvue/mpvue-quickstart my-project# 安装依赖$ cd my-project$ npm install# 启动构建$ npm run dev
设置底部导航栏
添加一个页面
1234mkdir democd demotouch index.vuetouch main.js
main.js
1234import Vue from "vue";import App from "./index";const app = new Vue(App);app.$mount();
index.vue
12345678910111213<template> <div>index</div></template ...
python3 flask 使用Mysql数据库
python3 flask 使用 Mysql 数据库
创建 flask 基本项目结构
12from flask import Flaskapp = Flask(__name__)
安装flask-sqlalchemy
1pip install flask-sqlalchemy
导入配置
123456from flask_sqlalchemy import SQLAlchemyapp.config['SQLALCHEMY_DATABASE_URI'] = 'mysql+pymysql://root:root@localhost/hhh'app.config['SQLALCHEMY_COMMIT_ON_TEARDOWN'] = Trueapp.config['SQLALCHEMY_TRACK_MODIFICATIONS'] = Truedb = SQLAlchemy(app)
python3 不再支持 MySQKdb,连接 mysql 数据库需要使用 pymysql
安装 pymysql
pip in ...
vue-cli3使用和Cordova集成记录
1. 安装安装过程很简单
123npm install -g @vue/cli# ORyarn global add @vue/cli
安装后使用vue --version查看是否安装成功
2. 创建项目123vue create demo# ORvue ui #使用ui界面进行创建
选项
默认
手动选择
我们选择手动选择功能,具体选择如下
1234567? Please pick a preset: Manually select features? Check the features needed for your project: Babel, Router, Vuex, CSS Pre-processors, Linter? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by default): LESS? Pick a linter / formatter config: Prettier? Pick additional lint features ...
nodejs和Thinkjs
Node.jsNode.js 简述Node.js:简单的说 Node.js 就是运行在服务端的 JavaScript。
Node.js 安装配置 (介绍在 window 和 Linux 上的安装 Node.js 的方法)
Node.js 官方文档
官方文档介绍:
Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。
Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型,使其轻量又高效。事件驱动与异步 IO 的讲解
Node.js 的包管理器 npm,是全球最大的开源库生态系统。
认识包管理器 npm(npm 已经在安装 Node.js 的时候安装好了)
当我们在 Node.js 上开发时,会用到很多别人写的 JavaScript 代码。如果我们需要使用别人写的某个包,每次都根据名称搜索一下官方文档,下载代码,解压,再使用,非常繁琐。于是一个集中管理的工具应运而生:大家都把自己开发的模块打包后放到npm官网上,如果要使用,直接通过 npm 安装就可以直接使用,不管代码存在哪,应该从哪下载。
更重要的是,如果我们要 ...
angular常用方法、指令、服务、过滤器
angular 方法1. 拷贝数组或对象1angular.copy(source, [destination]);
2. 选择一个元素1angular.element(element); //jqLite
3. 比较值是否相等1angular.equals(o1, o2); //返回值:boolean
4. 迭代对象1angular.forEach(obj, iterator, [context]); //iteeator是一个方法function(value,key,[obj]){处理代码}
5. 把 json 字符串转换为对象1angular.fromJson(json);
6.把对象转换为 json 字符串1angular.toJson(obj, pretty); //pretty为ture时,输出字符串有换行符和空格。如果设置为一个整数,JSON输出将包含许多空间每缩进(默认为2)
7. 判断是否为数组、时间、DOM 元素、函数、数字、对象、字符串、未定义、12345678angular.isArray(value);angular.is ...
判定 this 到底指向哪个对象
判定 this现在,我们可以按照优先顺序来总结一下从函数调用的调用点来判定 this 的规则了。按照这个顺序来问问题,然后在第一个规则适用的地方停下。
函数是通过 new 被调用的吗(new 绑定)?如果是,this 就是新构建的对象。var bar = new foo()
函数是通过 call 或 apply 被调用(明确绑定),甚至是隐藏在 bind 硬绑定 之中吗?如果是,this 就是那个被明确指定的对象。var bar = foo.call( obj2 )
函数是通过环境对象(也称为拥有者或容器对象)被调用的吗(隐含绑定)?如果是,this 就是那个环境对象。var bar = obj1.foo()
否则,使用默认的 this(默认绑定)。如果在 strict mode 下,就是 undefined,否则是 global 对象。var bar = foo()
以上,就是理解对于普通的函数调用来说的 this 绑定规则 所需的全部。是的……几乎是全部
摘自:You-Dont-Know-JS
用作备忘
Flex布局和Grids 布局
Flex 布局
Flex 是弹性布局,使用display:flex或display: inline-flex指定为 flex 布局
默认 水平的是主轴,垂直的是交叉轴
容器的属性(属性第一个为默认值)
flex-direction 主轴方向 row | row-reverse | column | column-reverse
flex-wrap 项目换行方式 nowrap | wrap | wrap-reverse
flex–flow 以上两个属性的缩写
justify-content 项目在主轴的对齐方式 flex-start | flex-end | center | space-between | space-around
align-items 项目在交叉轴对齐方式 flex-start | flex-end | center | baseline | stretch
align-content 多跟 轴线 的对齐方式,只有一根轴线则不起作用 flex-start | flex-end | center | space-between | space-around | str ...
vuex 学习笔记
state
记录所有数据和状态的,跨页面使用的
getters
store 里的计算属性
12345678910111213141516{ state:{ aaa:2 }, getters:{ // 通过$store.getters.aaacheng2访问 aaacheng2:state=>{ return state.aaa*2 }, // 通过$store.getters.aaacheng(6)访问 aaacheng:(state)=>(n)=>{ return state.aaa*n } }}// mapGetters 辅助函数 将 store 中的 getter 映射到局部计算属性
mutation
用于修改 state 状态
1234increment (state, n) { state.count += n ...
VUE环境配置
安装 vue
在 vue官网,使用 cli 命令行脚手架创建基本项目
123456789# 全局安装 vue-clinpm install --global vue-cli# 创建一个基于 webpack 模板的新项目vue init webpack my-project# 安装依赖,走你cd my-project# 或者 yarnnpm installnpm run dev
运行npm run dev 打开浏览器 http://localhost:8080
配置开发环境 vscode
使用 eslint 规范代码质量
vscode 安装插件 eslint
配置代码格式化规则 eslint
12345678910111213"eslint.autoFixOnSave": true,"eslint.validate": [ "javascript", "javascriptreact", { "language": "html", ...
electron 中使用autobahn 不工作问题记录
在 authbahn 源代码中if (global.process && global.process.versions.node) {判断当前的运行环境为 node 环境,但实际上 electron 中使用的还是 web。所以暂时删除掉判断,直接进入 else,为浏览器环境。目前可以正常运行,不知道以后会不会出现其他问题。