uniapp 开发实操二：uniapp 调用 微信小程序自定义组件

用uniapp 开发手机app，有些功能需要结合原生代码进行开发.主流原生有android,ios,微信小程序等。下面先来看下uniapp 如何调用微信小程序自定义组件。

1.微信小程序原生调用组件

页面源码：

样式：

.container{

padding: 25rpx;

display: flex;

flex-direction: row;

justify-content: space-between;

}

引用组件

{

"usingComponents": {

"movie": "../../components/movie/index"

}

}

2.微信组件

组件源码：

自然美景自然美景自然美景自然美景

样式：

.container{

  width: 200rpx;

  display: flex;  

  flex-direction: column;

  align-items: center;

}

.img{

  width: 100%;

  height: 300rpx;

}

.txt{

  width: 100%;

  font-size:30rpx ;

  white-space: nowrap;

  text-overflow: ellipsis;

  overflow: hidden;

  word-break: break-all;

}

3.组件在uniapp中的使用：

（1）新建 wxcomponents 文件夹 ，将微信小程序组件源码拷贝到该目录下

 （2）页面中引用

（3）运行uniapp 生成微信小程序源码，在源码相应的页面引入组件