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 -v3、检查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 }...