写这篇文章之前，在想要不要写，后来还是写吧，毕竟是遇到过的问题，经过一番周折才解决掉的，写来就作为提醒吧，
微信小程序判断多个条件可以用wx:if wx:elif wx:else的方法
具体用法上代码

1
2
3

<view class="small_num"  style="color:green" wx:if="{{dayLtePrateT=='下降'}}">{{dayLtePrateT}}{{dayLtePrate}}</view>
<view class="small_num"  style="color:#999999;box-shadow:0 0 0 1px #d9d9d9 inset" wx:elif="{{dayLtePrateT=='持平'}}">{{dayLtePrateT}}{{dayLtePrate}}</view>
<view class="small_num"  style="color:#f5222d" wx:else>{{dayLtePrateT}}{{dayLtePrate}}</view>

这就是在工作中遇到的问题，要根据返回的数据内容是”增加”,”下降”,”持平”的不同内容 来确定她们的不同样式，当然这也可通过直接操作数据的形式达到效果,或者通过在dom树上用“三目运算”的方式解决（判断三个条件，用三目运算符的方法好像不好处理）不过自己感觉这个方法简单一点。

1

小程序滚动条

另外多说一句吧，有时候在页面的最外层加了“scroll-view”的标签，页面的底部还会有横向的滚动条,（“scroll-view”的作用是”可滚动视图区域”,包括许多属性，包括”scroll-x”和”scroll-y”）解决办法是把”scroll-view”标签，改成”scroll-y”标签，意思是不允许横向滚动，另外去掉纵向的默认的滚动条的方法是在最外层的标签加上样式

1
2
3

page::-webkit-scrollbar {
    display: none;
}

官网antd：https://ant.design/docs/react/introduce-cn
antd的依赖安装

1

npm install antd --save

UI库的引入组件按需加载，安装依赖

1

npm install babel-plugin-import --save-dev

到这里还没有完，还需要做一些配置，在“.babelrc”文件夹下，添加如下配置

“plugins”: [

["import", {libraryName: "antd", style: "css"}] // import js and css modularly (css built files)

]
另外注意react的.js代码里的字符串要用单引号，注意空格问题

在分享小程序模板的引入方法之前，先来聊一下，小程序的跳转问题；小程序的跳转是 navigator负责。注意这个组件跳转的路径是“非tabBar”页面，并且要注意要跳转的页面在app.js的“ “pages””配置上路径，另外，点击事件的路径跳转也是跳转的是“非tabBar”页面才会起作用。
url: 要跳转的路径，这里是可以传值的。参数与路径之间用？隔开，每个参数用&隔开，可以在要跳转的页面下查看参数

WXML提供模版(template),可以在模版中定义代码片段,然后在不同的地方调用.微信小程序的模版可以用name来命名它的名字,在使用的时候用is来声明使用的模版,然后将模版所需要的data传入即可,如下

在 index.wxml 中引用了 text.wxml，就可以使用text模板：
引入方法如下

react的生态圈非常庞大，第三方的构建工具也有很多种，这节课介绍一个在业内比较流行的构建工具generator-react-webpack，它是需要yeoman的支持的。
安装还是在命令行用npm进行安装，不过在全局安装generator-react-webpack之前，你可以先安装yeoman。命令如下：
安装

1
2

npm install -g yo
npm install -g generator-react-webpack

创建目录
我们先用命令自行创建一个文件：new-react-demo

1

mkdir new-react-demo

进入这个文件夹

1

cd new-react-demo

用生成器生成我们的项目目录

1

yo react-webpack

用npm start就可以查看效果了。
项目起来之后我们来配置路由
Router包安装:
安装包还是要打开命令行工具，使用npm来进行安装。

1

npm install --save react-router react-router-dom

react-router：是基本的router包，里边函的内容较多，但是在网页开发中有很多用不到，现在的市面上的课程讲的基本都是这个包的教程。
react-router-dom：随着react生态环境的壮大，后出现的包，这个包比react-router包轻巧了很多。
剩下的就是代码了，直接上图 index.js的内容

接下来是路由到两个页面的页面内容

注意的点是样式的写法，比如’引入方式’，’驼峰命名’,
当然样式的写法还有其他的写法，这里先不赘余。
效果

在Windows 7系统运行中。往往会遇到想要删除某个文件夹时，系统提示：文件夹访问被拒绝 你需要权限来执行此操作，如何才能删除此类文件夹呢？
删除需要管理员权限才能删除的文件夹的方法
方法一：制作一个管理员授权的文件，把这个文件加入注册表
步骤：
开始 - 运行（输入notepad）- 确定或者回车,打开记事本（出可以从：开始-所有程序-附件-记事本）；
在打开的记事本中复制下列文件：
Windows Registry Editor Version 5.00
[HKEY_CLASSES_ROOT*\shell\runas]
@=”管理员授权”
“NoWorkingDirectory”=””
[HKEY_CLASSES_ROOT*\shell\runas\command]
@=”cmd.exe /c takeown /f \”%1\” && icacls \”%1\” /grant administrators:F”
“IsolatedCommand”=”cmd.exe /c takeown /f \”%1\” && icacls \”%1\” /grant
administrators:F”
[HKEY_CLASSES_ROOT\exefile\shell\runas2]
@=”管理员授权”
“NoWorkingDirectory”=””
[HKEY_CLASSES_ROOT\exefile\shell\runas2\command]
@=”cmd.exe /c takeown /f \”%1\” && icacls \”%1\” /grant administrators:F”
“IsolatedCommand”=”cmd.exe /c takeown /f \”%1\” && icacls \”%1\” /grant
administrators:F”
[HKEY_CLASSES_ROOT\Directory\shell\runas]
@=”管理员授权”
“NoWorkingDirectory”=””
[HKEY_CLASSES_ROOT\Directory\shell\runas\command]
@=”cmd.exe /c takeown /f \”%1\” /r /d y && icacls \”%1\” /grant administrators:F /t”
“IsolatedCommand”=”cmd.exe /c takeown /f \”%1\” /r /d y && icacls \”%1\” /grant
administrators:F /t”

点记事本左上角的“文件” - 另存为 ，在另存为窗口下面的：文件名（N）中输入：管理员授权.reg ，再点：保存；

这时桌面上会有一个：管理员授权.reg的注册表文件，

我们左键双击：管理员授权.reg文件，在弹出的：注册表编辑器窗口点：是（Y）；

在点是以后弹出的窗口中点：确定，我们右键单击一个文件夹，会看到右键菜单中有：管理员授权的菜单。

如果我们要删除文件夹，则右键该文件夹 - 运行管理员授权，再删除该文件夹就可以顺利地删除了。

#github的注册以及可以自行百度
使用以下命令生成SSH Key

1

$ ssh-keygen -t rsa -C "youremail@example.com"

创建新项目的步骤如下

然后输入相关内容就可以了 如下图（test4）

然后创建一个文件test4,通过git工具 git bash进入这个文件执行如下图的命令即可（github上有提示）

至此，可以把要托管的项目放到test4文件夹下，然后进入文件路径下执行一系列git命令(git add –all/git commit -m “解释”/ git push -u origin master)

已经有挺长时间没有开始写博客，最近工作需要用到react，要对webpack有所了解，下面就分享webpack的一些用法

先建立项目文件，然后进入项目文件，执行相关命令

1

1、安装webpack，在命令行输入cnpm install --save-dev webpack

这里的参数–save是要保存到package.json中，dev是在开发时使用这个包，而生产环境中不使用。

1

在命令行输入 cnpm init

输入完成后，npm终端会问你关于项目的名称，描述……一堆内容，如果你不考虑发布到npm上，这些内容都不重要，而且我们后期还可以用文本的形式修改这些内容。现在我们只要一路回车就完成了初始化。这时用dir命令已经可以看到生成的package.json文件了。

1

建立项目结构

进入我们建立的文件，建立两个根文件src，dist
src文件夹：用来存放我们编写的javascript代码，可以简单的理解为用JavaScript编写的模块。
dist文件夹：用来存放供浏览器读取的文件，这个是webpack打包成的文件。

你可以理解成src是源码文件，dist是我们编译打包好的文件；一个用于开发环境，一个用于生产环境。

1

编写程序文件

文件夹建立好后，我们在dist文件下手动建立一个index.html文件，并写入下面的代码。

这里引入了一个JavaScript的bundle.js文件。这个文件现在还没有，这是用webpack执行打包命令后生产的文件。我们的index.html写好后，接下来在src文件夹下建立entery.js的文件，用于编写我们的JavaScript代码，也是我们的入口文件。

1

配置文件：入口和出口

配置文件webpack.config.js
webpack.config.js就是Webpack的配置文件，这个文件需要自己在项目根目录下手动建立。建立好后我们对其进行配置，先看下面的代码（webpack.config.js的基本结构），这是一个没有内容的标准webpack配置模版。

#webpack.config.js

#entry选项（入口配置）
这个选项就是配置我们要压缩的文件一般是JavaScript文件（当然也可以是CSS…..）

#wepback.config.js中的entry选项

#output选项（出口配置）
出口配置是用来告诉webpack最后打包文件的地址和文件名称的。

如果你只这样写，是会报错的：找不到path这个东西。所以我们要在webpack.config.js的头部引入path，代码如下：
const path = require(‘path’);
这个代码写完后，可以在终端中直接输入webpack就会进行打包。

1

配置文件： 服务和热更新

设置webpack-dev-server
要执行webpack-dev-server是要先用npm install webpack-dev-server –save-dev 来进行下载的。下载好后，需要配置一下devServer。最简单的devServer配置项只有四个。先看一下代码，然后我再作解释
/webpack.config.js

然后在package.json里配置一下scripts
/package.json

配置好保存后，在终端里输入 npm run server 打开服务器。然后在浏览器地址栏输入http://localhost:1717就可以看到结果了

1

插件配置：HTML文件的发布

有经验的小伙伴其实一眼就可以看出，现在我们的项目结构是有问题的，我们把index.html直接放到了dist文件夹下，这肯定是不正确的，应该放到我们src目录下。但是前期我们为了循序渐进的学习，所以把index.html放到了dist目录下。下面我们就学习如何把html文件打包到我们的生产路径下。

我们先把dist中的html文件剪切到src目录中，并去掉我们的JS引入代码（webpack会自动为我们引入JS），因为这才是我们真实工作的目录文件结构。

然后我们配置webpack.config.js文件，先引入我们的html-webpack-plugin插件。

1

const htmlPlugin= require('html-webpack-plugin');

引入后使用npm进行安装包。

1

npm install --save-dev html-webpack-plugin

最后在webpack.config.js里的plugins里进行插件配置，配置代码如下。

minify：是对html文件进行压缩，removeAttrubuteQuotes是却掉属性的双引号。
hash：为了开发中js有缓存效果，所以加入hash，这样可以有效避免缓存JS。
template：是要打包的html模版路径和文件名称。
上边的都配置完成后，我们就可以在终端中使用webpack，进行打包。你会看到index.html文件已经被打包到我们的dist目录下了，并且自动为我们引入了路口的JS文件。

1、首先在components文件夹下新建一个文件比如home.vue

2、比如在app.vue要用到，引入方法如下

1

组件之间的传递

传送门：https://www.cnblogs.com/daiwenru/p/6694530.html

在写这篇文章之前，先来解决，取消vue在检测写法规则的方法
找到目录build下的webpack.base.conf.js文件，把其中的rules里的这一段注销掉：

现在书归真转，路由的命名实际上就是给路由绑定一个name的属性，通过name的值来跳转；而参数的传递则可以在页面进行绑定，下面做一个最简单的例子
先把app.vue修改：

在修改接收参数的music.vue:

以上这种方法这样传递的参数就不会显示在url中。

下面来学习params方法传递的参数显示在url中
router文件夹下的index.js做如下修改

app.vue做如下修改

music.vue的写法

vue-router是Vue.js官方的路由插件，它和vue.js是深度集成的，适合用于构建单页面应用。vue的单页面应用是基于路由和组件的，路由用于设定访问路径，并将路径和组件映射起来。传统的页面应用，是用一些超链接来实现页面切换和跳转的。在vue-router单页面应用中，则是路径之间的切换，也就是组件的切换。

1、首先第一步，在components文件夹里新建两个.vue文件。将用它们来路由页面。并且分别取名router1.router2

2、接下来，我们要在app.vue里写好2个导航命名为router1和router2。分别用来将router2,router1路由进来。

3、在router文件夹下面的index.js做如下操作，注意路径的地方的”/“不要丢掉

4、子路由的使用方法(例子：router1的子路由)
4.1、在components文件夹下创建chi.vue
在router文件夹下面的index.js引入子路由页面

4.2、子路由的路径写法

4.3、子路由的父级的内容写法