<template>
<view style="border:1px solid red">
<view class="rich">
<rich-text user-select="true" mode="native" :nodes="str"></rich-text>
</view>
<!-- <n-chat>
<n-message text="想要提升写作能力,就要在平时的学习过程中,不断的积累好词好句,多读范文,对于好句好段,要多进行仿写,写得多了,就能有自己的写作方法和技巧了"></n-message>
<n-message reverse text="想要提升写作能力,就要在平时的学习过程中,不断的积累好词好句,多读范文,对于好句好段,要多进行仿写,写得多了,就能有自己的写作方法和技巧了"></n-message>
</n-chat> -->
</view>
</template>
<script setup lang="uts">
const title = ref('Hello')
let str=ref('')
function getRandomAvatar() : string {
const seed = Math.floor(Math.random() 99999) + 1
const bgColors = ['b6e3f4', 'ffdfbf', 'd1f7c4', 'ffc0cb', 'c1e1ff', 'e2c9ff']
const bg = bgColors[Math.floor(Math.random() bgColors.length)]
return https://api.dicebear.com/10.x/avataaars/svg?seed=${seed}&backgroundColor=${bg}
}
setTimeout(()=>{
str.value=<div style="word-wrap:break-word;border:1px solid red; margin-top:10px;"> <span style="font-weight: 400;">想​</span><span style="font-weight: 400;">要​</span><span style="font-weight: 400;">提​</span><span style="font-weight: 400;">升​</span><span style="font-weight: 400;">写​</span><span style="font-weight: 400;">作​</span><span style="font-weight: 400;">能​</span><span style="font-weight: 400;">力​</span><span style="font-weight: 400;">,​</span><span style="font-weight: 400;">就​</span><span style="font-weight: 400;">要​</span><span style="font-weight: 400;">在​</span><span style="font-weight: 400;">平​</span><span style="font-weight: 400;">时​</span><span style="font-weight: 400;">的​</span><span style="font-weight: 400;">学​</span><span style="font-weight: 400;">习​</span><span style="font-weight: 400;">过​</span><span style="font-weight: 400;">程​</span><span style="font-weight: 400;">中​</span><span style="font-weight: 400;">,​</span><span style="font-weight: 400;">不​</span><span style="font-weight: 400;">断​</span><span style="font-weight: 400;">的​</span><span style="font-weight: 400;">积​</span><span style="font-weight: 400;">累​</span><span style="font-weight: 400;">好​</span><span style="font-weight: 400;">词​</span><span style="font-weight: 400;">好​</span><span style="font-weight: 400;">句​</span><span style="font-weight: 400;">,​</span><span style="font-weight: 400;">多​</span><span style="font-weight: 400;">读​</span><span style="font-weight: 400;">范​</span><span style="font-weight: 400;">文​</span><span style="font-weight: 400;">,​</span><span style="font-weight: 400;">对​</span><span style="font-weight: 400;">于​</span><span style="font-weight: 400;">好​</span><span style="font-weight: 400;">句​</span><span style="font-weight: 400;">好​</span><span style="font-weight: 400;">段​</span><span style="font-weight: 400;">,​</span><span style="font-weight: 400;">要​</span><span style="font-weight: 400;">多​</span><span style="font-weight: 400;">进​</span><span style="font-weight: 400;">行​</span><span style="font-weight: 400;">仿​</span><span style="font-weight: 400;">写​</span><span style="font-weight: 400;">,​</span><span style="font-weight: 400;">写​</span><span style="font-weight: 400;">得​</span><span style="font-weight: 400;">多​</span><span style="font-weight: 400;">了​</span><span style="font-weight: 400;">,​</span><span style="font-weight: 400;">就​</span><span style="font-weight: 400;">能​</span><span style="font-weight: 400;">有​</span><span style="font-weight: 400;">自​</span><span style="font-weight: 400;">己​</span><span style="font-weight: 400;">的​</span><span style="font-weight: 400;">写​</span><span style="font-weight: 400;">作​</span><span style="font-weight: 400;">方​</span><span style="font-weight: 400;">法​</span><span style="font-weight: 400;">和​</span><span style="font-weight: 400;">技​</span><span style="font-weight: 400;">巧​</span><span style="font-weight: 400;">了​</span> </div>
},500)
function handleMenuClick(e) {
console.log('e', e)
}
</script>
<style>
.logo {
height: 100px;
width: 100px;
margin: 100px auto 25px auto;
}
.title {
font-size: 18px;
color: #8f8f94;
text-align: center;
}
.rich{
max-width: 500rpx;
border-radius: 10rpx;
background: pink;
padding:20rpx;
}
</style>