2020925王杉

学习内容:

微信小程序开发:

  • 微信公众号品台注册

  • 小程序开发与网页开发区别:开发工具不同、开发环境不同、开发语言不同。

  • 文件类型:.wxml类似html .wxss类似css .jsonjson文件属于页面的属性配置文件,用来配置需要使用的组件路径和一些样式的配置 .js是js专门用于微信开发的语言没有DOM和BOM

  • 创建文件:打开app.json在pages下创建路径 例如:"pages/admin/admin",*注意名字不要在一个文件下创建多个文件。路径保存文件自动生成。第三方组件库 Vant Weap 查看使用说明

  • 常用组件:

    1. 视图容器类似于HTML中的div

      内属性hover-class 点击时的样式;hover-start-time 按住的一定时间后出现点击样式; hover-stay-time松开后的点击的样式;

    2. 相当于HTML中的span、p标签,当next单独使用类似于块级元素自动换行

      <text>1</text>
      <text>2</text>
      <text>3</text>
      <view class="wrap">
      <text>5</text>
      <text>6</text>
      <text>7</text>
      </view>

      内属性:space 空格

      <view>
       <text space="ensp">a a a d d d</text>
      </view>
      <view>
      <text space="nbsp">a a a d d d</text>
      </view>
    3. 相当于HTML中的img标签默认大小:320*340

      内属性:src:"../../"(相对路径)图片路径; mode图片裁剪缩放模式; show-menu-by-longpress长按图片显示小程序菜单; lazy-load图片懒加载,在即将进入一定范围(上下三屏)时才开始加载,提升项目效率;

    4. 按钮:

      内属性:type颜色; size:default;大小 loading:true;正在加载效果

      plain:true镂空 disabled:true;禁用

    5. 和HTML中input类似

    6. 从底部弹起的滚动选择器

    7. 组件轮播图

    8. 搭配swiper使用,为轮播的每一项

    9. 图标

    10. 网页中的from

学习心得:

今天开始了对微信小程序的学习,安装和文件结构的了解说明还有就是主要是一些组件的学习,就和html的基础学习一样,多靠练习使用来熟悉。学起来也不难都是些基础没有很有逻辑性的东西,加油!

评论