zoukankan      html  css  js  c++  java
  • uni-app实战写法

    接口的封装,在手机截图截得有封装的代码单独一个文件,封装完

    在min.js文件引入,挂载到vue全局实例上,

    直接this.xxx()

    在组件页面里发请求,手机截图有获取数据,渲染数据

     在meoths里定义方法发请求保存数据,在onload函数里调用方法

    在横向四个平均小导航模块里

    先用弹性盒写出静态布局,然后定义出来一个数组数据

    来循环出所有的导航,给每一个导航提供一个点击时间,

    传一个url路径参数,通过编程试导航跳转页面

    商品列表两列展示,写出来一个商品结构,使用弹性盒布局,然后渲染商品数据就行了

    上拉加载触发函数onReachBottom(),手机有截图在请求商品的时候,this.data=[...this.data,res..data.lisi]

    在上拉加载触发函数里

    先判断获取的商品lenges是否等于返回的总数,如果等于就return  this.底线盒子=true,不在请求,并且让有底线盒子显示

    让pageindex++

    然后调用请求商品接口的方法,

    封装请求,也支持anync,waeit

    url.request({url:"xxxx"})

    uni滚动组件scroll-view

    <scroll-view>

       <view>

       </view>

    </scroll-view>

    被该标签包裹的内容会有滚动效果,有控制属性,来设置横向,或者纵向效果。里边的li需要设宽度,高度也要设,高度可设成百分百。

    一进来就渲染第一条的话,在onload函数里调用请求一级导航方法,在方法里,调用每一个导航绑定的事件,传入0,和第一个导航的id

    每一个导航点击高亮,根据接口返回的导航数组,循环渲染导航,设初始数据等于0 然后通过点击事件数组索引动态加类名

    做第二件事,渲染右侧对应的数据,需要传入第二个id参数,拿到参数,调用接口,获取右侧数据,渲染数据

    rich-view组件标签,可以解析p标签

    页面传值,编程试导航传id到详情,详情页在onload(option)里拿到参数。然后赋值this.id=id,  然后调用获取轮播图数据的方法,初次渲染数据

    加入购物车底部的组件,用uni-ui组件,来导入组件,会在components文件夹里

    引入之后固定底部,宽度百分百,z-99.

    盖住内容,可以让之前的盒子给一个下边的padding距离

  • 相关阅读:
    html5 Canvas画图3:1px线条模糊问题
    移动端适配
    JSON数据转换方法 parse()和stringify()
    原生的强大DOM选择器querySelector
    正则去空格方法
    HTML5开发手机应用--viewport的作用
    编译原理的认识与感悟
    CSS实例:图片导航块
    导航,头部,CSS基础
    web基础,用html元素制作web页面
  • 原文地址:https://www.cnblogs.com/zzhqdkf/p/12731246.html
Copyright © 2011-2022 走看看