zc_saas_h5/pages3/news/detail.vue

<template>
	<view class="content">
		<nav-bar title="新闻详情"></nav-bar>
	<view class="headerBox">
	      <view class="title">{{ listData.title }}</view>
	      <view class="time">
	        发布时间：{{ $method.formDate(listData.createTime, "yyyy/mm/dd") }}
	      </view>
	    </view>
	    <view
	      class="ql-editor html_content"
	      style="white-space: pre-wrap; height: auto;padding-bottom: 30px;"
	      v-html="listData.titleContent"
	    ></view>
	<!-- <view class="content">
		<view v-if="detail.mobileDetailHtml" v-html="detail.mobileDetailHtml"
			style="width: 100%; overflow: hidden"></view>
	</view> -->
</view>
</template>

<script>
// import "quill/dist/quill.core.css";
	import {
		mapGetters
	} from "vuex";
	export default {
		data() {
			return {
				listData:{},
			};
		},
		onLoad(option) {
			uni.hideTabBar();
			// console.log(option,987)
			this.init(option.id);
		},
		onShow() {
			
		},
		methods: {
			 init(id) {
			      this.$api
			        .consultationdetails(id)
			        .then(res => {
			          if(res.data.code==200){
			            this.listData =res.data.data;
			          }
			          // this.list = res.rows;
			          // this.total = res.total;
			        })
			        .finally(() => {
			        });
			    },
		},
	};
</script>

<style>
	.html_content {
		padding: 20rpx;;
	  img {
	    max-width: 100% !important;
	    height: auto !important;
	  }
	}
	.headerBox {
	  padding: 20rpx 40rpx 0rpx;
	 
	  
	}
	.title {
		    font-size: 32rpx;
		    color: #222;
		    font-weight: bold;
		    margin: 30rpx 0rpx;
		    text-align: center;
		    border-bottom: 1rpx solid #eee;
		    padding-bottom: 40rpx;
		  }
		  .time {
		    text-align: center;
		    margin: 10rpx 0rpx;
		    color: #333;
		    font-size: 24rpx;
		  }
	.last_next {
	  border-top: 1rpx dashed #eee;
	  padding: 30rpx 30rpx 50rpx;
	  & > p {
	    cursor: pointer;
	    user-select: none;
	    margin-top: 30rpx;
	    font-size: 24rpx;
	    color: #666;
	    display: flex;
	    align-items: center;
	    & > span {
	      flex-shrink: 0;
	      &:last-child {
	        flex: 1;
	        overflow: hidden;
	        white-space: nowrap;
	        text-overflow: ellipsis;
	        margin-left: 24rpx;
	      }
	    }
	  }
	}
</style>