konggang-city-miniprogram/pages/enterprise/product_detail.vue

<template>
  <div class="content">
    <div class="title">
      <div class="logo">
        <img :src="logo" alt="" mode="aspectFit" />
      </div>
      <div class="name">
        {{ name }}
      </div>
    </div>
    <div class="fwb" v-html="company">
		<u-parse :content="company"/>
	</div>
    <!-- <div style="width: 100%">
      <footer-share
        style="width: 100%"
        :isCollection="true"
        @collectionPages="collectionPage"
        @sharePages="sharePage"
      ></footer-share>
    </div> -->
  </div>
</template>
<script>
import uParse from '@/components/gaoyia-parse/parse.vue'	
export default {
  components: {
		uParse
	},
  onLoad(option) {
    this.getRich(option.id);
  },
  data() {
    return {
      company: "",
      logo: getApp().globalData.company_logo,
      name: getApp().globalData.company_name,
    };
  },
  methods: {
    replaceImg(html) {
      let result = html.replace(
        /<img [^>]*src=['"]([^'"]+)[^>]*>/gi,
        function (match, capture) {
		  if(capture.includes('http')){
			  return (
				"<img src=" +
				capture +
				' style="max-width:100%;height:auto;display:block;margin:10px 0;"/>'
			  );
		  }else {
			return (
			  "<img src=" +
			  getApp().globalData.shareUrl +
			  capture +
			  ' style="max-width:100%;height:auto;display:block;margin:10px 0;"/>'
			);
		  }	
        }
      );
      return result;
    },
    getRich(ids) {
      uni.request({
        url: `https://kiq.xazhima.com/content/company_product/${Math.floor(
          ids / 1000
        )}/${ids}.html`,
        method: "GET",
        header: {
          "content-type": "application/x-www-form-urlencoded",
        },
        success: (res) => {
          if (res.statusCode === 200) {
            this.company = this.replaceImg(res.data);
          }
        },
        fail: () => {
          console.log("连接失败");
        },
      });
    },
  },
};
</script>
<style lang="scss">
.content {
  padding: 4%;
  font-size: 30rpx;
  .title {
    display: flex;
    align-items: center;
    border-radius: 10rpx;
    margin-bottom: 50rpx;
    box-shadow: rgba(0, 0, 0, 0.35) 0rpx 5rpx 15rpx;
    .logo {
      image {
        width: 150rpx;
        height: 100rpx;
        margin: 0 30rpx;
      }
    }
  }
}
</style>