The title at the top of the article details page of the uniapp WeChat applet dynamically corresponds to the title returned on the article list page

Article details page code map:
insert image description here
code:
template

<template>
	<view class="policy-detail">
		<view class="title">{
    
    {
    
    description}}</view>
		<view class="time">{
    
    {
    
    createTime}}</view>
		<view class="info">
			<rich-text :nodes="content"></rich-text>
		</view>
	</view>
</template>

script

<script>
	var http = require("../../utils/http.js");
	var config = require("../../utils/config.js");
	export default {
    
    
		data() {
    
    
			return {
    
    
				policyId:'',
				title:'',
				description:'',
				createTime:'',
				content:''
			}
		},
		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad: function(options) {
    
    
			console.log(options.policyId)
			this.policyId = options.policyId
			this.getPolicyDetail()
		},
		methods: {
    
    
			getPolicyDetail:function(){
    
    
				uni.showLoading();
				var params = {
    
    
					url: "/***/***",
					method: "GET",
					data: {
    
    
						policyId: this.policyId
					},
					callBack: res => {
    
    
						this.policyContent = res.data
						this.title = res.data.title 
						this.description = res.data.description 
						this.createTime = res.data.createTime 
						this.content = res.data.content
						uni.setNavigationBarTitle({
    
    
							title: this.title
						});
						uni.hideLoading()
					},
				};
				http.request(params);
			},
		}
	}
</script>

style

<style>
	page {
    
    
		background: #f9f9f9;
	}
	.policy-detail{
    
    
		padding: 30rpx;
	}
	.title{
    
    
		font-size: 32rpx;
		text-align: center;
		color: #333333;
		margin-top: 35rpx;
	}
	.time{
    
    
		font-size: 25rpx;
		color: #666666;
		margin-top: 30rpx;
		margin-bottom: 30rpx;
		text-align: right;
	}
	.info{
    
    
		font-size: 32rpx;
		color: #333333;
	}
</style>

Guess you like

Origin blog.csdn.net/maoge_666/article/details/131824493