|
@@ -15,6 +15,11 @@ class PreviousEditions extends React.Component<any, any> {
|
|
|
this.state = {
|
|
|
height: 0,
|
|
|
heightLine: 0,
|
|
|
+ list: [
|
|
|
+ {
|
|
|
+ url: "https://cxzx.smcic.net/topic/tool/img/%E5%B0%91%E5%84%BF%E4%B9%A6%E7%94%BB%E5%A4%A7%E8%B5%9B/R-C.jfif"
|
|
|
+ }
|
|
|
+ ]
|
|
|
};
|
|
|
}
|
|
|
|
|
@@ -32,34 +37,40 @@ class PreviousEditions extends React.Component<any, any> {
|
|
|
});
|
|
|
};
|
|
|
|
|
|
+ showImage = (url: string) => {
|
|
|
+ Taro.previewImage({
|
|
|
+ urls: [url],
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
render() {
|
|
|
// const { } = this.props;
|
|
|
const w = this.#systemInfo.screenWidth - 60;
|
|
|
- const h = (w / 16) * 9;
|
|
|
return (
|
|
|
<View className="PreviousEditions">
|
|
|
<Image
|
|
|
- style={`width: ${this.#systemInfo.screenWidth}px;height: ${
|
|
|
- this.state.height
|
|
|
- }px;`}
|
|
|
+ style={`width: ${this.#systemInfo.screenWidth}px;height: ${this.state.height
|
|
|
+ }px;`}
|
|
|
src="https://cxzx.smcic.net/topic/tool/img/%E5%B0%91%E5%84%BF%E4%B9%A6%E7%94%BB%E5%A4%A7%E8%B5%9B/banner-2.png"
|
|
|
onLoad={this.getImageSize}
|
|
|
/>
|
|
|
<InputBox>
|
|
|
- <Video
|
|
|
- src=""
|
|
|
- controls={true}
|
|
|
- style={`width: ${w}px;height: ${h}px;`}
|
|
|
- loop
|
|
|
- muted
|
|
|
- className="video"
|
|
|
- />
|
|
|
- <Image
|
|
|
- src={line}
|
|
|
- onLoad={this.getImageSizeLine}
|
|
|
- className="line"
|
|
|
- style={`width: ${w}px;height: ${this.state.heightLine}px;`}
|
|
|
- />
|
|
|
+ {this.state.list.map(v => {
|
|
|
+ return (<View>
|
|
|
+ <Image
|
|
|
+ src={v.url}
|
|
|
+ className="zuopin"
|
|
|
+ mode="aspectFit"
|
|
|
+ onClick={() => this.showImage(v.url)}
|
|
|
+ />
|
|
|
+ <Image
|
|
|
+ src={line}
|
|
|
+ onLoad={this.getImageSizeLine}
|
|
|
+ className="line"
|
|
|
+ style={`width: ${w}px;height: ${this.state.heightLine}px;`}
|
|
|
+ />
|
|
|
+ </View>)
|
|
|
+ })}
|
|
|
</InputBox>
|
|
|
</View>
|
|
|
);
|