qq_44629323的博客

原创 flex布局---指定几个盒子在一行平均分，超出盒子换行左对齐

原创 微信小程序----性别选择，并实现数据渲染

原创 vue在多页面情况下在子页面中进行点击页面部分被跳转

通常我们在实现了vue多页面之后都会遇到一个问题，那就是在多页面中在进行页面跳转还是像之前的单页面一样配置路由吗？答案是：NO！我们在进行多页面跳转之后在子页面中进行跳转不使用路由，我们只需要在点击跳转出来的多页面中进行配置即可：代码：在红框中的代码才是本次需要的代码代码:<template> <div id="app"> <ul> <li v-for="(tab,index) in tabs" @click="toggle(ind

原创 vue 多页面跳转配置与实现（看了就会，一步一步作）

通常我们在vue框架中制作页面都是单页面操作，如果我们想要进行多页面操作，比如实现显示不同ico图标都需要进行多页面操作，下面我们一起来实现实现多页面跳转需要进行页面的移动和配置1.初始化项目，进入项目根目录下，我们会看一般性的文档配置如下：我们需要修改的是public文件夹和src文件夹，以及增加一个配置文件vue.config.js.在我们原本的项目中index.html、main.js和app.vue的位置是：1.index.html —> 在public文件夹下2.main.js

原创 vue css下拉菜单

<div class="dropdown"> <span>Mouse over me</span> <div class="dropdown-content"> <p>Hello World!</p> </div></div><style> .dropdown { position: relative; display: i

原创 Vue router 类似tab切换使用

在上一次的文章中我们知道了如何安装以及Vue router的基本使用，这次我们来聊聊Vue router的切换如何实现1.首先我们需要在上一次创建好的项目中新建几个待切换的.vue文件2.然后我们需要在router.js里面添加代码// 组件import Text1 from './components/Text1'import Text2 from './components/Text2'import Text3 from './components/Text3'3.同在router

原创 Vue router在Visual Studio Code中的安装与使用

Vue Router 是 Vue.js 官方的路由管理器。它和 Vue.js 的核心深度集成，让构建单页面应用变得易如反掌。包含的功能有：嵌套的路由/视图表模块化的、基于组件的路由配置路由参数、查询、通配符基于 Vue.js 过渡系统的视图过渡效果细粒度的导航控制带有自动激活的 CSS class 的链接HTML5 历史模式或 hash 模式，在 IE9 中自动降级自定义的滚动条行为1.安装Vue router1.先新建一个vue，把他拉进Visual Studio Code在Visu

原创 vue中，组件父传子，子传父

父传子子组件父组件效果第二种父传子父组件子组件注意：可以只导入一次组件二.子传父父组件子组件

原创 vue基础知识以及声明式数据渲染，条件与循环，用户信息输入，双向绑定等简单编写

一，声明式数据渲染，条件与循环，用户信息输入，双向绑定等简单编写1、{{ message }}2、v-if3、v-for4、v-on:click5、v-model1.声明式数据渲染注意：需要注意的是在vue的数据渲染中的数组时必须要有反回值。这就出现了2.v-if条件渲染3.v-for循环4.v-on:click处理绑定点击这里做了一个点击反转函数两种方法：采用第二种：效果：5.v-model处理用户输入：一。生命周期beforeCreate创建

原创 如何将vue.js项目导入Visual Studio Code进行编辑

当vue 在Visual Studio Code里面运行时我们需要把整个项目拖拽到里面2.我们打开终端3.如果我们直接在里面属于yarn serve启动会报错，这时我们首先在1.右键开始菜单找到Windos PowerShell，直接搜也行2.打开之后执行set-ExecutionPolicy RemoteSigned命令，输入A即可，如下图所示输入A回车即可4.回到Visual Studio Code先把这个注释掉，不用HelloWorld这个组件，然后在终端输入yarn ser

原创 win10安装GIT，node.js ,cnpm,yarn,vue,vue脚手架的完整安装

一：在安装vue的时候要先安装node.js；安装步骤：1.在安装之前我们首先安装一个GIT工具，（就是cmd差不多但是好用）https://git-scm.com/安装完成之后在桌面右键出现**2.node.js安装**：（推荐安装长期稳定版本12.18.。。）node官网：https://nodejs.org/en/进入点击安装完成在git工具中输入node -v检查是否成功，成功会出现版本号检验npm是否存在：npm -v3.cnpm安装安装成功后接下来安装

原创 HTML-H5基本样式之---浮动的使用与清除

css浮动是一种使元素脱离文档流的方法，会使元素向左或向右移动，其周围的元素也会重新排列。Float（浮动），往往是用于图像，但它在布局时一样非常有用。相信大家在进行页面布局的时候会出现这样的问题在页面的默认页面流时是从上到下进行排列的，这是就会出现问题，怎样改变这种布局呢，我们就用到了css flex弹性布局或者css的Float（浮动），下面我们展开对浮动的简单应用：1.首先我们打开常用的编辑软件，我用的是Hbuder,当然用别的也可以我们在里面定义一个div当大盒子给它的class属性起一个名字

原创 微信小程序vant weapp组件库的使用

上一篇文章我们安装了组件库，接下来让我们来使用这个组件库1.首先我们先将app.json中的"sty1e”: "v2” 去除， 小程序的新版基础组件强行加上了许多样式，难以去除，不关闭将造成部分组件样式混乱按ctrl+s保存快捷键2.比如我们想弄一个按钮：我们需要在新建的wxml文件中添加代码<van-button type="primary">主要按钮</van-button>按ctrl+s保存快捷键就会显示出来但是这是你会发现没有显示按钮，因为并没有引入组件

原创 微信小程序组件库之一 Vant weapp安装与使用以及node安装

在微信小程序的开发过程中为了节省时间和方便我们常用组件库去辅助开发，下面我就来介绍一个组件库vant weapp组件库1.在使用vant weapp组件库时我们首先需要进行安装，官方提供的方法是用npm进行安装，接下来我首先介绍npm的安装：特别注意（配置环境太麻烦，跟多新手都踩坑，所以路径建议用英文，就不用配置环境了）npm安装需要安装node，在百度上搜索node.js即可：搜索node.js中文网点击进入下载进入点击windows安装包或者点击64位进行下载用npm -v或者nod

原创 前端开发常用工具图标库

分享一个常用免费的图标库，超级好用阿里巴巴矢量图标库https://www.iconfont.cn/

原创 微信小程序入门教程----小程序的创建以及基本介绍

面对广大小白同学，进行小程序入门教程1.打开微信小程序会出现这样的界面1.给项目起一个名字，自己比较习惯用英文，不使用云开发2.目录可以自己选择（首先应该新建一个空的项目文件夹，点击选择文件夹，点击新建）3.AppID:可以在官网查看（1.首先登录，2.点击开发，3.点击开发者设置）https://mp.weixin.qq.com/4.新建项目之后文件夹里会出现如下文件5.进入项目简单介绍下其中几个文件夹pages文件夹是存放页面文件目录（就是在这些页面中进行小程序的编写）ind

原创 w10系统命令界面node,yarn,cnpm,vue安装

1.安装GET工具（类似于cmd（好用））2.安装node.js（检查安装：node -v，）3.检查npm（再node里面存在） :npm4.cnpm安装：https://developer.aliyun.com/mirror/NPM?from=tnpmnpm install -g cnpm --registry=https://registry.npm.taobao.org(检验cnpm:cnpm -v )5.yarn安装：npm install -g yarn(检验:yarn -v)6.

转载 LVS和Nginx实现负载均衡功能的比较

负载均衡的概念：由于目前现有网络的各个核心部分随着业务量的提高，访问量和数据流量的快速增长，其处理能力和计算强度也相应地增大，使得单一的服务器设备根本无法承担。在此情况下，如果扔掉现有设备去做大量的硬件升级，这样将造成现有资源的浪费，而且如果再面临下一次业务量的提升时，这又将导致再一次硬件升级的高额成本投入，甚至性能再卓越的设备也不能满足当前业务量增长的需求。针对此情况而衍生出来的一种廉价有...