luping_的博客

原创 vue中router创建Tab组件

1 在components中创建如下3个组件 2 router.js中配置组件 3Vue中使用children实现路由的嵌套 4 建立连接 5 默认路径 6 效果图如下

原创 vue router

1、安装：npm install vue-router或cnpm install vue-router或yarn add vue-router 在node_modules里出现vue-router即可 2、在新建router.js中引用如下代码 3、在src中新建view文件夹，在view新建例如：Home文件夹，在文件夹中新建index.vue，在index.vue中引入如下代码 并新建一个Content组件，引入如下代码 4、在router.js中设置如下两步 5、在Ap

原创 Vue组件传值

1父传子（方法一） 父传子（方法二） 2子传父 子组件 父组件

原创 Vue生命周期（8个阶段）

1 beforeCreate(创建前) 2 created(创建后) 3 beforeMount(载入前) 4 mounted(载入后) 5 beforeUpdate(更新前) 6 updated(更新后) 7 beforeDestroy(销毁前) 8 destroyed(销毁后) Vue第一次页面加载会触发beforeCreatecreatedbeforeMountmounted四个钩子函数 DOM渲染在mounted这个周期就已经完成 ...

原创 Vue处理用户输入 事件绑定 双向绑定

事件绑定v-on:click 双向绑定v-model

原创 Vue声明式渲染 条件与循环

循环

原创 vue条件渲染

原创 Vue中 v-if和v-show的区别

原创 Vue基础知识

原创 Vue安装步骤

1、安装git工具，便于在wind电脑上操作命令行，自行在网上下载安装，可以不安装 2、安装node,检查node安装是否成功，在git工具中输入node -v 3、检查npm是否安装成功，在git工具中输入npm(npm一般随node一起安装在电脑中，node如果成功了，npm基本都会没问题) 4、cnpm安装参考网站：https://developer.aliyun.com/mirror/NPM?from=tnpm 在git工具中输入：npm install -g cnpm --registry

原创 echarts 属性基础用法3

原创 echarts属性基础用法2

原创 echarts属性基础用法1

原创 小程序轮播图

<!-- 轮播图 --> <swiper class="banner" indicator-dots="true" autoplay="true" interval="3000" duration="1000"> <view> <block wx:for="{{banner}}" wx:key="{{item.id}}"> <swiper-item> <image bindtap=...

原创 小程序获取当前时间

（获取年月日） 1.return year+"年"+month+"月"+day+"日" 2.return [year, month, day].map(formatNumber).join('/') + ' ' + [hour, minute, second].map(formatNumber).join(':') （获取/） return [year, month, day].map(formatNumber).join('/') （相对页面的js里） //获取当前系统日期和时间 var uti.

原创 button按钮分享

(wxml) <button class="fenxiang" open-type="share"> <view class="shezhi_one"> <view class="shezhi"> <view>分享田园</view> <!-- <image src="../../images/jiantou.jpg"></image> --> ...

原创 tabBar底部导航栏

tabBar "tabBar":{ "color":"#ccc", "backerStyle":"white", "selectedColor":"#555", "backgroundColor": "#ffffff", "list":[ { "pagePath":"pages/shouye/shouye", "iconPath": "images/shouye1.png", "selectedIconPath": "im...

原创 Api接口调用

//轮播图 console.log('开始请求轮播图',new Date()); wx.request({ url: app.baseURL+'/wx/product/all_banner', method:"POST", success:function(res){ console.log(res); console.log('请求轮播图完成',new Date()); ...

原创 绑定事件

按钮绑定事件和组件绑定事件 组件绑定事件代码 (wxml) bindtap="dianhua" (js)写在data外面 dianhua:function(){ this.setData({ show:true }) }, 组件绑定事件代码 (wxml) bindtap="dianhua" (js)写在data外面 dianhua:function(){ this.setData({ show:true }...