首先先新建Music组件
微信截图_20181121011210.png
由于跟服务器请求的数据只有标题和唱片封面，因此可以在index.js数据中如下定义
properties:{
img:String,
content:String
}
data:{
pauseSrc:'images/playwating.png',
playSrc:'images/playerplaying.png'
}
wxml页面编写如下
<view>
<image src="{{img}}" />
<image src="{{playSrc}}" />
<img src="images/music@tag.png" />
</view>
img,content为需要在服务器请求下来的数据
最后的样子大概是这样
微信截图_20181121012014.png
由于后面的句子，散文组件的样式都差不多，如果重复定义数据会增加工作量，这时候就需要用到behavior这个东西，用来继承
首先我们要新建一个js文件，我们命名为classic-heh.js
let classicBeh = Behavior({
propertier:{
img:String,
content:String //定义公共样式
}
})
export {classicBeh} //导出行为
因此我们组件中index.js中的文件就可以改写成这样了
import {classicBeh} from '../classicBeh.js
behaviors:[classicBeh] //有s的原因是因为不仅仅只能继承一个behaviors
propertier:{} //此时里面可以清空，因为已经继承了里面的属性
