element-ui练习使用总结
<el-row>
<el-col class="borderRed" :span="24">
<div class="grid-content bg-purple height"> </div>
</el-col>
</el-row>
<el-row>
<el-col class="borderRed" :span="12">
<div class="grid-content bg-purple"> </div>
</el-col>
<el-col class="borderRed" :span="12">
<div class="grid-content bg-purple"> </div>
</el-col>
</el-row>
<!-- 间隔分栏 gutter指定栏之间的间隔-->
<el-row :gutter="20">
<el-col class="borderRed" :span="6"><div class="grid-content bg-purple"> </div></el-col>
<el-col class="borderRed" :span="6"><div class="grid-content bg-purple"> </div></el-col>
<el-col class="borderRed" :span="6"><div class="grid-content bg-purple"> </div></el-col>
<el-col class="borderRed" :span="6"><div class="grid-content bg-purple"> </div></el-col>
</el-row>
<!-- 偏移 offset指向右的偏移量-->
<el-row :gutter="20">
<el-col class="borderRed" :span="12" :offset="6"><div class="grid-content bg-purple"> </div></el-col>
</el-row>
<!-- flex对齐方式 -->
<el-row type="flex" justify="end">
<el-col class="borderRed" :span="6"><div class="grid-content bg-purple"> </div></el-col>
<el-col class="borderRed" :span="6"><div class="grid-content bg-purple"> </div></el-col>
<el-col class="borderRed" :span="6"><div class="grid-content bg-purple"> </div></el-col>
</el-row>
<el-row type="flex" justify="space-between">
<el-col class="borderRed" :span="6"><div class="grid-content bg-purple"> </div></el-col>
<el-col class="borderRed" :span="6"><div class="grid-content bg-purple"> </div></el-col>
<el-col class="borderRed" :span="6"><div class="grid-content bg-purple"> </div></el-col>
</el-row>
<!-- 响应式布局 xs sm md lg xl-->
<el-row :gutter="10">
<el-col class="borderRed" :xs="8" :sm="6" :md="4" :lg="3" :xl="1"><div class="grid-content bg-purple"> </div></el-col>
<el-col class="borderRed" :xs="4" :sm="6" :md="8" :lg="9" :xl="11"><div class="grid-content bg-purple"> </div></el-col>
<el-col class="borderRed" :xs="4" :sm="6" :md="8" :lg="9" :xl="11"><div class="grid-content bg-purple"> </div></el-col>
<el-col class="borderRed" :xs="8" :sm="6" :md="4" :lg="3" :xl="1"><div class="grid-content bg-purple"> </div></el-col>
</el-row>
<!-- 响应式 用栅格实现列偏移的妙用 -->
<el-row :gutter="0">
<el-col :xs="0" :md="6"><div class="grid-content"> </div></el-col>
<el-col class="borderRed" :xs="24" :md="12"><div class="grid-content bg-purple"> </div></el-col>
</el-row>
container布局（flex布局，注意兼容性！！！）
<el-container>
<el-header>Header</el-header>
<el-container>
<el-aside width="200px">Aside</el-aside>
<el-container>
<el-main>Main</el-main>
<el-footer>Footer</el-footer>
</el-container>
</el-container>
</el-container>
style
.el-header, .el-footer {
background-color: #B3C0D1;
color: #333;
text-align: center;
line-height: 60px;
}
.el-aside {
background-color: #D3DCE6;
color: #333;
text-align: center;
line-height: 200px;
}
.el-main {
background-color: #E9EEF3;
color: #333;
text-align: center;
line-height: 160px;
}
body > .el-container {
margin-bottom: 40px;
}
.el-container:nth-child(5) .el-aside,
.el-container:nth-child(6) .el-aside {
line-height: 260px;
}
.el-container:nth-child(7) .el-aside {
line-height: 320px;
}
icon图
<i class="el-icon-edit"></i>
<i class="el-icon-share"></i>
<i class="el-icon-delete"></i>
<el-button type="primary" icon="el-icon-search">搜索</el-button>
按钮
使用type、plain、round和circle
<el-row>
<el-button>默认按钮</el-button>
<el-button type="primary">主要按钮</el-button>
<el-button type="success">成功按钮</el-button>
<el-button type="info">信息按钮</el-button>
<el-button type="warning">警告按钮</el-button>
<el-button type="danger">危险按钮</el-button>
</el-row>
链接文字
<div>
<el-link href="https://element.eleme.io" target="_blank">默认链接</el-link>
<el-link type="primary">主要链接</el-link>
<el-link type="success">成功链接</el-link>
<el-link type="warning">警告链接</el-link>
<el-link type="danger">危险链接</el-link>
<el-link type="info">信息链接</el-link>
</div>
radio单选框 和按钮框
要使用 Radio 组件，只需要设置v-model绑定变量，选中意味着变量的值为相应 Radio label属性的值，label可以是String、Number或Boolean。
<template>
<el-radio v-model="radio" label="1">备选项</el-radio>
<el-radio v-model="radio" disabled label="2">备选项</el-radio>
<el-radio v-model="radio" label="3" border size="medium">备选项</el-radio>
<el-radio v-model="radio" label="4" border size="small">备选项</el-radio>
</template>
<input type="text" v-model="radio" >
<el-radio-group v-model="radio1" @change="aa(radio1)">
<el-radio-button label="上海" ></el-radio-button>
<el-radio-button label="北京" ></el-radio-button>
<el-radio-button label="广州"></el-radio-button>
<el-radio-button label="深圳"></el-radio-button>
</el-radio-group>
<input type="text" v-model="radio1">
多选按钮
<template>
<el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox>
<div style="margin: 15px 0;"></div>
<el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChange">
<el-checkbox v-for="city in cities" :label="city" :key="city">{{city}}</el-checkbox>
</el-checkbox-group>
</template>
<script>
import global from '@/js/global.js';
const cityOptions = ['上海', '北京', '广州', '深圳'];
export default {
components:{
},
data(){
return {
text:"com1",
checkAll: false,//是否全选 true/false
checkedCities: ['上海', '北京'],//目前所选的项的数组
cities: cityOptions,//供选列表（总列表）
isIndeterminate: true,//true表示选有 但是没选完 false表示（全选或一个都没选）
}
},
mounted(){
},
methods:{
handleCheckAllChange(val) {
console.log(val);//是否全选true/false
this.checkedCities = val ? cityOptions : [];
this.isIndeterminate = false;
console.log(this.checkedCities);
console.log(this.checkAll);
console.log(this.isIndeterminate);
},
handleCheckedCitiesChange(value) {
console.log(value);//被选中项的数组
let checkedCount = value.length;
this.checkAll = checkedCount === this.cities.length;
this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length;
console.log(this.isIndeterminate);//是否全选或完全没选
console.log(this.checkAll)
}
}
}
</script>
注释： 在group上绑定:min="num" 或 :max="num" 可以限制最大选择数量和最小选择数量
输入框的使用
写一个响应式（宽度）的输入框（必须要双向绑定值，否则不能用）
<el-row>
<el-col :xs="0" :md="6"> </el-col>
<el-col :xs="24" :md="12">
<el-input v-model="input" placeholder="请输入内容"></el-input>
</el-col>
</el-row>
下面是一个 前后加icon图 可以清空内容 可以查看密码的 输入框 （比较全面的功能）
<el-row>
<el-col :xs="0" :md="6"> </el-col>
<el-col :xs="24" :md="12">
<el-input
v-model="input"
suffix-icon="el-icon-date"
prefix-icon="el-icon-search"
clearable
show-password
placeholder="请输入内容"></el-input>
</el-col>
</el-row>
文本域
<el-row>
<el-col :span="12" :offset="6">
<el-input
type="textarea"
:rows="2"
placeholder="请输入内容"
v-model="textarea">
</el-input>
<!-- 自适应高度 只加autosize属性就行 设置最小行和最大行时需要绑定值 -->
<el-input
type="textarea"
:autosize="{ minRows: 2, maxRows: 4}"
placeholder="请输入内容"
v-model="textarea2">
</el-input>
</el-col>
</el-row>
复合型输入框
<div>
<el-input placeholder="请输入内容" v-model="input1">
<template slot="prepend">Http://</template>
</el-input>
</div>
<div style="margin-top: 15px;">
<el-input placeholder="请输入内容" v-model="input2">
<template slot="append">.com</template>
</el-input>
</div>
<div style="margin-top: 15px;">
<el-input placeholder="请输入内容" v-model="input3" class="input-with-select">
<el-select v-model="select" slot="prepend" placeholder="请选择">
<el-option label="餐厅名" value="1"></el-option>
<el-option label="订单号" value="2"></el-option>
<el-option label="用户电话" value="3"></el-option>
</el-select>
<el-button slot="append" icon="el-icon-search"></el-button>
</el-input>
</div>
可通过 size 属性指定输入框的尺寸，除了默认的大小外，还提供了 large、small 和 mini 三种尺寸。
也可以做带提示的输入框，可以参考文档
选择框的使用
<el-select v-model="value" placeholder="请选择" @change="aa">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
data
options: [{
value: '选项1',
label: '黄金糕'
}, {
value: '选项2',
label: '双皮奶'
}, {
value: '选项3',
label: '蚵仔煎'
}, {
value: '选项4',
label: '龙须面'
}, {
value: '选项5',
label: '北京烤鸭'
}
],
value: ''
methods
aa(a){
console.log(a)
}
可设置 多选！！！而且所选的值 显示在框内！！
联级选择器
<div class="block">
<span class="demonstration">默认 click 触发子菜单</span>
<el-cascader
v-model="value"
:options="options"
@change="handleChange"></el-cascader>
</div>
<div class="block">
<span class="demonstration">hover 触发子菜单</span>
<el-cascader
v-model="value"
:options="options"
:props="{ expandTrigger: 'hover' }"
@change="handleChange"></el-cascader>
</div>
data
value: [],
options: [{
value: 'zhinan',
label: '指南',
children:[
{
value:"二级值",
label:"二级label",
children:[
{
value:"三级值",
label:"三级label"
}
]
}
]
}]
methods
handleChange(value) {
console.log(value);
}
可以通过设置 仅显示最后一项的值 请查文档
也可以单选 或多选 任意一级选项 查文档
swicth开关！！
<el-tooltip :content="'Switch value: ' + value" placement="top">
<el-switch
v-model="value"
active-color="#13ce66"
inactive-color="#ff4949"
active-value="100"
inactive-value="0">
</el-switch>
</el-tooltip> <el-switch
v-model="value1"
active-text="按月付费"
inactive-text="按年付费">
</el-switch>
<el-switch
style="display: block"
v-model="value2"
active-color="#13ce66"
inactive-color="#ff4949"
active-text="按月付费"
inactive-text="按年付费">
</el-switch>
data
value: '100',
value1: true,
value2: true
有change事件
upload上传（兼容性不咋滴）
<el-upload
class="upload-demo"
action="https://jsonplaceholder.typicode.com/posts/"
:on-preview="handlePreview"
:on-remove="handleRemove"
:before-remove="beforeRemove"
multiple
:limit="3"
:on-exceed="handleExceed"
:file-list="fileList">
<el-button size="small" type="primary">点击上传</el-button>
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
</el-upload>
data
fileList: [
{
name: 'food.jpeg',
url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'
},
{
name: 'food2.jpeg',
url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'
}
]
methods
handleRemove(file, fileList) {
console.log(file, fileList);
},
handlePreview(file) {
console.log(file);
},
handleExceed(files, fileList) {
this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
},
beforeRemove(file, fileList) {
return this.$confirm(`确定移除 ${ file.name }？`);
}
表格
<el-table
:data="tableData"
style="width: 100%"
stripe
border
height="250">
<el-table-column
prop="date"
label="日期"
width="100"
fixed>
</el-table-column>
<el-table-column
prop="name"
label="姓名"
width="100">
</el-table-column>
<el-table-column
prop="address"
label="地址"
fixed="right">
</el-table-column>
</el-table>
data
tableData: [
{
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
},
{
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
},
{
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
}
]
表格还有其它非常强大的功能 但是只支持pc端。。 PC端的话可以去查文档 尽情使用（折叠，树形）
tag标签
<el-tag>标签一</el-tag>
<el-tag type="success">标签二</el-tag>
<el-tag type="info">标签三</el-tag>
<el-tag type="warning">标签四</el-tag>
<el-tag type="danger">标签五</el-tag>
<!-- 动态编辑标签 -->
<el-tag
:key="tag"
v-for="tag in dynamicTags"
closable
:disable-transitions="false"
@close="handleClose(tag)">{{tag}}</el-tag>
<el-input
class="input-new-tag"
v-if="inputVisible"
v-model="inputValue"
ref="saveTagInput"
size="small"
@keyup.enter.native="handleInputConfirm"
@blur="handleInputConfirm"
></el-input>
<el-button v-else class="button-new-tag" size="small" @click="showInput">+ New Tag</el-button>
data
dynamicTags: ['标签一', '标签二', '标签三'],
inputVisible: false,
inputValue: ''
methods
handleClose(tag) {
this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
},
showInput() {
this.inputVisible = true;
this.$nextTick(_ => {
this.$refs.saveTagInput.$refs.input.focus();
});
},
handleInputConfirm() {
let inputValue = this.inputValue;
if (inputValue) {
this.dynamicTags.push(inputValue);
}
this.inputVisible = false;
this.inputValue = '';
}
感觉很不错
进度条
树形控件
。
。
。
导航
<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
<el-menu-item index="1">处理中心</el-menu-item>
<el-submenu index="2">
<template slot="title">我的工作台</template>
<el-menu-item index="2-1">选项1</el-menu-item>
<el-menu-item index="2-2">选项2</el-menu-item>
<el-menu-item index="2-3">选项3</el-menu-item>
<el-submenu index="2-4">
<template slot="title">选项4</template>
<el-menu-item index="2-4-1">选项1</el-menu-item>
<el-menu-item index="2-4-2">选项2</el-menu-item>
<el-menu-item index="2-4-3">选项3</el-menu-item>
</el-submenu>
</el-submenu>
<el-menu-item index="3" disabled>消息中心</el-menu-item>
<el-menu-item index="4"><a href="https://www.ele.me" target="_blank">订单管理</a></el-menu-item>
</el-menu> <div class="line"></div> <el-menu
:default-active="activeIndex2"
class="el-menu-demo"
mode="horizontal"
@select="handleSelect"
background-color="#545c64"
text-color="#fff"
active-text-color="#ffd04b">
<el-menu-item index="1">处理中心</el-menu-item>
<el-submenu index="2">
<template slot="title">我的工作台</template>
<el-menu-item index="2-1">选项1</el-menu-item>
<el-menu-item index="2-2">选项2</el-menu-item>
<el-menu-item index="2-3">选项3</el-menu-item>
<el-submenu index="2-4">
<template slot="title">选项4</template>
<el-menu-item index="2-4-1">选项1</el-menu-item>
<el-menu-item index="2-4-2">选项2</el-menu-item>
<el-menu-item index="2-4-3">选项3</el-menu-item>
</el-submenu>
</el-submenu>
<el-menu-item index="3" disabled>消息中心</el-menu-item>
<el-menu-item index="4"><a href="https://www.ele.me" target="_blank">订单管理</a></el-menu-item>
</el-menu>
data
activeIndex: '1',
activeIndex2: '1'
methods
handleSelect(key, keyPath) {
console.log(key, keyPath);
}
tabs标签页
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="用户管理" name="first">用户管理</el-tab-pane>
<el-tab-pane label="配置管理" name="second">配置管理</el-tab-pane>
<el-tab-pane label="角色管理" name="third">角色管理</el-tab-pane>
<el-tab-pane label="定时任务补偿" name="fourth">定时任务补偿</el-tab-pane>
</el-tabs>
data
activeName: 'second'
methods
handleClick(tab, event) {
console.log(tab, event);
}
form表单
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
<el-form-item label="活动名称haaa的冯绍峰" prop="name">
<el-input v-model="ruleForm.name"></el-input>
</el-form-item>
<el-form-item label="活动区域" prop="region">
<el-select v-model="ruleForm.region" placeholder="请选择活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
<el-form-item label="活动时间" required>
<el-col :span="11">
<el-form-item prop="date1">
<el-date-picker type="date" placeholder="选择日期" v-model="ruleForm.date1" style="width: 100%;"></el-date-picker>
</el-form-item>
</el-col>
<el-col class="line" :span="2">-</el-col>
<el-col :span="11">
<el-form-item prop="date2">
<el-time-picker placeholder="选择时间" v-model="ruleForm.date2" style="width: 100%;"></el-time-picker>
</el-form-item>
</el-col>
</el-form-item>
<el-form-item label="即时配送" prop="delivery">
<el-switch v-model="ruleForm.delivery"></el-switch>
</el-form-item>
<el-form-item label="活动性质" prop="type">
<el-checkbox-group v-model="ruleForm.type">
<el-checkbox label="美食/餐厅线上活动" name="type"></el-checkbox>
<el-checkbox label="地推活动" name="type"></el-checkbox>
<el-checkbox label="线下主题活动" name="type"></el-checkbox>
<el-checkbox label="单纯品牌曝光" name="type"></el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="特殊资源" prop="resource">
<el-radio-group v-model="ruleForm.resource">
<el-radio label="线上品牌商赞助"></el-radio>
<el-radio label="线下场地免费"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="活动形式" prop="desc">
<el-input type="textarea" v-model="ruleForm.desc"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm('ruleForm')">立即创建</el-button>
<el-button @click="resetForm('ruleForm')">重置</el-button>
</el-form-item>
</el-form>
data
ruleForm: {
name: '',
region: '',
date1: '',
date2: '',
delivery: false,
type: [],
resource: '',
desc: ''
},
rules: {
name: [
{ required: true, message: '请输入活动名称', trigger: 'blur' },
{ min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
],
region: [
{ required: true, message: '请选择活动区域', trigger: 'change' }
],
date1: [
{ type: 'date', required: true, message: '请选择日期', trigger: 'change' }
],
date2: [
{ type: 'date', required: true, message: '请选择时间', trigger: 'change' }
],
type: [
{ type: 'array', required: true, message: '请至少选择一个活动性质', trigger: 'change' }
],
resource: [
{ required: true, message: '请选择活动资源', trigger: 'change' }
],
desc: [
{ required: true, message: '请填写活动形式', trigger: 'blur' }
]
}
methods
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
alert('submit!');
} else {
console.log('error submit!!');
return false;
}
});
},
resetForm(formName) {
this.$refs[formName].resetFields();
}
element-ui练习使用总结的更多相关文章
- 使用element ui 日期选择器获取值后的格式问题
一般情况下,我们需要给后台的时间格式是: "yyyy-MM-dd" 但是使用Element ui日期选择器获取的值是这样的: Fri Sep :: GMT+ (中国标准时间) 在官 ...
- element ui 1.4 升级到 2.0.11
公司的框架 选取的是 花裤衩大神开源的 基于 element ui + Vue 的后台管理项目, 项目源码就不公开了,记录 分享下 步骤 1. 卸载 element ui 1.4的依赖包 2. 卸载完 ...
- [坑况]饿了么你是这样的前端——vue+element ui 【this dependency was not found：'element-ui/lib/theme-chalk/index.css'】
element ui 坑况:今日pull代码,潇洒npm run dev ,被告知:this dependency was not found:'element-ui/lib/theme-chalk/ ...
- Vue + Element UI项目初始化
1.安装相关组件 1.1安装Node 检查本地是否安装node node -v 如果没有安装,从Node官网下载 1.2安装npm npm -v 如果没有安装:使用该指令安装: npm install ...
- Element UI——本地引入iconfont不显示
前言 前面因为本地引入Element UI导致了iconfont不显示,所以只好再去Element UI官网去扒下iconfot 步骤 进入官网 组件 | Element UI F12进入控制台,找到 ...
- Html | Vue | Element UI——引入使用
前言 做个项目,需要一个效果刚好Element UI有,就想配合Vue和Element UI,放在tp5.1下使用,但是引入在线的地址各种报错,本地引入就完美的解决了问题! 代码 __STATIC_J ...
- 分享一个自搭的框架，使用Spring boot+Vue+Element UI
废弃,新的:https://www.cnblogs.com/hackyo/p/10453243.html 特点:前后端分离,可遵循restful 框架:后端使用Spring boot,整合了aop.a ...
- 上传图片组件封装 element ui
// element ui 文档地址: http://element.eleme.io/#/zh-CN <template> <div> <div class=" ...
- vue项目使用element ui的Checkbox
最近使用到element ui的下拉多选框Checkbox Checkbox用法可参考与于 http://element.eleme.io/#/zh-CN/component/checkbox Che ...
- vue的$nextTick使用总结，this.$refs为undefined的解决办法，element Ui的树形控件setCheckedKeys方法无法使用
其实这3个讲的是一个问题,先说下问题,我在watch里设置一个监听,当弹窗打开时,自动添加树形的默认选中项, 但奇怪的是this.$refs为undefined,自然setCheckedKeys无法使 ...
随机推荐
- Python学习笔记：格式化输出
%d digit%s string%f float程序运用:name = input("please input your name:")age = int(input(" ...
- 16.screen相关
screen -S yourname -> 新建一个叫yourname的sessionscreen -ls -> 列出当前所有的sessionscreen -r yourname -> ...
- 一文看懂java io系统 (转)
出处: 一文看懂java io系统 学习java IO系统,重点是学会IO模型,了解了各种IO模型之后就可以更好的理解java IO Java IO 是一套Java用来读写数据(输入和输出)的A ...
- 【KMP】OKR-Periods of Words
[KMP]OKR-Periods of Words 题目描述 串是有限个小写字符的序列,特别的,一个空序列也可以是一个串.一个串P是串A的前缀,当且仅当存在串B,使得A=PB.如果P≠A并且P不是一个 ...
- 利用element-ui封装地址输入的组件
我们前端做项目时,难免会遇到地址输入,多数情况下,我们都是提供一个省市三级联动,加上具体地址输入的Input输入框给用户,用以获取用户需要输入的真实地址.在需要对用户输入的数据进行校验的时候,我们会单 ...
- hdu 5446 lucas+crt+按位乘
http://acm.hdu.edu.cn/showproblem.php?pid=5446 题意:题目意思很简单,要你求C(n,m)mod p的值 p=p1*p2*...pn; 题解:对于C(n,m ...
- 1-MySQL DBA笔记-理解MySQL
第一部分 入门篇 本篇首先介绍MySQL的应用领域.基础架构和版本,然后介绍MySQL的基础知识,如查询的执行过程.权限机制.连接.存储引擎,最后阐述一些基础概念. 第1章 理解MySQL 本章将介绍 ...
- Java远程通讯可选技术及原理
转自:https://www.linuxidc.com/index.htm 在分布式服务框架中,一个最基础的问题就是远程服务是怎么通讯的,在Java领域中有很多可实现远程通讯的技术,例如:RMI.MI ...
- 7.使用EXPLAIN 来分析SQL和表结构_1
explain:查看执行计划 使用explain 关键字可以模拟优化器执行SQL查询语句,从而知道MySQL是如何处理你的SQL语句的 分析你的查询语句或是表结构的性能瓶颈 使用explain 可以获 ...
- Mysql(九)：Python连接MySQL数据库之pymysql模块使用
Python3连接MySQL 本文介绍Python3连接MySQL的第三方库--PyMySQL的基本使用. PyMySQL介绍 PyMySQL 是在 Python3.x 版本中用于连接 MySQL 服 ...