weex入门到掌握(1)

onfail (event) {

this.state = ‘onfinish’

}

}

}

9.制作列表

1.先看一下loadmore组件的功能代码：用于上拉加载

{{rum}}

2.loading组件的使用：用于下拉加载的组件

组件 要使用组件你需要先去组件上的loadmore和loadmoreoffset属性，并在list中加入组件

代码详情：

{{rum}}

Loading…

3.组件

实际开发中还需要刷新页面，weex在列表中也为我们想好了，提供了 组件，它的作用就是在上拉时进行刷新页面

Refreshing …

{{rum}}

Loading…

10.从后端服务器上获取数据

1.stream的引入

要想使用stream，必须使用weex来进行引入。

stream.fetch(options, callback[,progressCallback]):

options {Object}：请求的一些选项 包含：

method {string}：HTTP 方法 GET 或是 POST

url {string}：请求的 URL

headers {Object}：HTTP 请求头

type {string}：响应类型, json,text 或是 jsonp {在原生实现中其实与 json 相同)

body {string}：HTTP 请求体。

注意：

body 参数仅支持 string 类型的参数，请勿直接传递 JSON，必须先将其转为字符串。

GET 请求不支持 body 方式传递参数，请使用 url 传参。

callback：回调函数

测试代码：

{{news.newsTitle}}

{{news.newsContent}}

{{news}}

method = GET

{{getResult}}

详细的stream使用代码：

method = GET

{{getResult}}

method = GET / type = jsonp

{{getJsonpResult}}

method = POST

{{postResult}}

method = PUT

{{putResult}}

method = DELETE

{{deleteResult}}

method = HEAD

{{headResult}}

method = PATCH

{{patchResult}}

11.作轮播图片效果

12.a组件和web组件

使用组件时需要和我们html中的标签区分，html中的标签是用来链接html页面的，而weex中的组件是用来链接weex格式的js文件的

判断是否可以访问到你所创建的文件：

先cd到创建的目录之下，使用命令ipconfig查看ipv4的地址

比如我的是192.168.239.1

后面添加端口号8080或者8081等。

访问地址http://192.168.239.1:8081/slider.js（slider.js就是你要判断是否可以访问的文件）

如果可以访问那么就会显示这个文件里面的内容，如果未显示，说明不能进行访问

index.vue中的主要代码如下：

跳转轮播图

下面讲一下web组件    在原生的软件中嵌入网站页面

13.通用事件和动画模块

1.先描述一些常见的事件：

<1>longpress(长按事件):如果一个组件被绑定了 longpress 事件，那么当用户长按这个组件时，该事件将会被触发。

<2>Appear（屏幕内事件）：如果一个位于某个可滚动区域内的组件被绑定了 appear 事件，那么当这个组件的状态变为在屏幕上可见时，

该事件将被触发。

<3>Disappear（屏幕外事件）:如果一个位于某个可滚动区域内的组件被绑定了 disappear 事件，

那么当这个组件被滑出屏幕变为不可见状态时，该事件将被触发。

2.动画效果：

14.weex的时间选取模块picker

1.pick(options1, callback {function (ret)})

options1:index {number}：默认选中的选项

items {array}：picker 数据源

textColor {color}：picker中文字的颜色

selectionColor {color}：picker中选中item的背景色

confirmTitle {string}：确认按钮的文案

cancelTitle {string}：取消按钮的文案

confirmTitleColor {color}：确认按钮的文字颜色

cancelTitleColor {color}：取消按钮的文字颜色

title {string}：对话框的标题

titleColor {color}：对话框标题的文字颜色

titleBackgroundColor {color}：对话框标题的背景色

callback {function (ret)}：执行完读取操作后的回调函数。ret {Object} 为 callback 函数的参数，

有两个属性：result {string}：结果三种类型 success, cancel, error

data {number}：选择的选项,仅成功确认时候存在。time 格式为 HH:mm, 仅成功确认的时候存在。

代码详情：

Time:

{{value}}

Pick Time

15.weex的粘贴模块clipboard

1.我们可以通过 clipboard 模块的 getString()、setString() 接口从系统的粘贴板获取内容或者设置内容。

但是需要注意的是clipboard仅支持文本拷贝，而且出于安全考虑和平台限制，只支持 Android 和 iOS，不支持 html5。

下面先看一下getString(callback)功能:用于从系统粘贴板读取内容

callback 函数的参数，有两个属性：

ret.data：获取到的文本内容；

ret.result：返回状态，可能为 success 或 fail。

再看一下setString(text)：用于将一段文本复制到剪切板，相当于手动复制文本。

参数text {string}：要复制到剪切板的字符串。

代码详情：

{{message}}

最后

自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。

深知大多数初中级Android工程师，想要提升技能，往往是自己摸索成长，自己不成体系的自学效果低效漫长且无助。

因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上Android开发知识点！不论你是刚入门Android开发的新手，还是希望在技术上不断提升的资深开发者，这些资料都将为你打开新的学习之门！

如果你觉得这些内容对你有帮助，需要这份全套学习资料的朋友可以戳我获取！！

由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！

.wrapper {

flex-direction: column;

justify-content: center;

}

.group {

flex-direction: row;

justify-content: center;

margin-bottom: 40px;

align-items: center;

}

.label {

font-size: 40px;

color: #888888;

}

.title {

font-size: 80px;

color: #41B883;

}

.button {

font-size: 36px;

width: 280px;

color: #41B883;

text-align: center;

padding-top: 25px;

padding-bottom: 25px;

border-width: 2px;

border-style: solid;

border-color: rgb(162, 217, 192);

background-color: rgba(162, 217, 192, 0.2);

}

15.weex的粘贴模块clipboard

1.我们可以通过 clipboard 模块的 getString()、setString() 接口从系统的粘贴板获取内容或者设置内容。

但是需要注意的是clipboard仅支持文本拷贝，而且出于安全考虑和平台限制，只支持 Android 和 iOS，不支持 html5。

下面先看一下getString(callback)功能:用于从系统粘贴板读取内容

callback 函数的参数，有两个属性：

ret.data：获取到的文本内容；

ret.result：返回状态，可能为 success 或 fail。

再看一下setString(text)：用于将一段文本复制到剪切板，相当于手动复制文本。

参数text {string}：要复制到剪切板的字符串。

代码详情：

{{message}}

最后

自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。

深知大多数初中级Android工程师，想要提升技能，往往是自己摸索成长，自己不成体系的自学效果低效漫长且无助。

因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。

[外链图片转存中…(img-KHfu0Uig-1715030636817)]

[外链图片转存中…(img-cNGjta0r-1715030636818)]

[外链图片转存中…(img-xz2cZqc3-1715030636818)]

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上Android开发知识点！不论你是刚入门Android开发的新手，还是希望在技术上不断提升的资深开发者，这些资料都将为你打开新的学习之门！

如果你觉得这些内容对你有帮助，需要这份全套学习资料的朋友可以戳我获取！！

由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！