原理

其实使用div和css做出三角形，原理就是对div盒子的border属性的运用。首先，先上个简单的代码：

create-react-app作为最常用的react脚手架集成了很多的常用功能，比如支持es6、JSX、动态import、Fetch(polyfill)、proxy、postcss、eslint等。但也有些功能并没有提供支持比如Hot-reloading和css预处理器，所以我们需要自定义配置这些功能。

有需求才有动力

在做项目的时候，有表格数据的展示。在后端的给的数据，前台显示的时候需要知道每个数据的key出现的次数。然后我就想了一下，基本解决需求。下面是我的实现方式。

什么是footer置底

页脚置底（Sticky footer）就是让网页的footer部分始终在浏览器窗口的底部。
当网页内容足够长以至超出浏览器可视高度时，页脚会随着内容被推到网页底部；但如果网页内容不够长，置底的页脚就会保持在浏览器窗口底部。

基本命令

1
2
3
4
5

git remote -v 
git remote add upstream git@github.com:xxx/xxx.git
git fetch upstream
git merge upstream/master
git push

react 基本浏览所得

1. jsx 属性必须使用驼峰命名
2. react 渲染更新的时候只更新改变的一部分
   阅读全文 »

vue做移动端适配，借助px2rem插件方便的将px单位转换为rem

安装

1

npm install px2rem-loader --save

造坑

在 vue 项目中，我们都知道对吸引人的莫过于数据的双向绑定。今天我要说的就是在数据绑定操作中遇到的问题。话不多说，上代码：

1
2
3
4
5
6
7
8

<h5>互动记录</h5>
<div class="check_box_style">
    <el-form-item :label="`${item}届`" v-for="item in enumsConfig.SysExpert.active" :key="item.id">
        <span class="box_style">
            <span v-for="(ele,index) in enumsConfig.SysExpert.status" :key="index" style="margin-right:10px;" class="colorC" :class="{ colorActive: expert_status_map[item] && expert_status_map[item].includes(ele.key) }" @click="setExpertStatus(item,ele.key)">{{ele.title}}</span>
        </span>
    </el-form-item>
</div>

遇到的业务需求

在写一个vue后台项目的时候，遇到了登录权限的管理。这时，后台给我的权限数据我获取之后，需要保存下来以备后来使用。然后我想到了vue的数据状态管理vuex和html5的本地存储功能。

起因

在项目开发中遇到了这样一个需求：在上传图片过程中，之前是通过直接点击input标签的type='file'来实现选择和浏览本地文件。

但是,现在遇到的问题是，通过点击其他的按钮来触发这个节点的点击事件。