Vue26 内置标签 v-text v-html

实例

DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8" />
		<title>v-text指令title>
		
		<script type="text/javascript" src="../js/vue.js">script>
	head>
	<body>
		
		
		<div id="root">
			<div>你好,{{name}}div>
			<div v-text="name">div>
			<div v-text="str">div>
		div>
	body>

	<script type="text/javascript">
		Vue.config.productionTip = false //阻止 vue 在启动时生成生产提示。
		
		new Vue({
			el:'#root',
			data:{
				name:'尚硅谷',
				str:'

你好啊!

'
} })
script> html>

Vue26 内置标签 v-text v-html_第1张图片

DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8" />
		<title>v-html指令title>
		
		<script type="text/javascript" src="../js/vue.js">script>
	head>
	<body>
		
		
		<div id="root">
			<div>你好,{{name}}div>
			<div v-html="str">div>
			<div v-html="str2">div>
		div>
	body>

	<script type="text/javascript">
		Vue.config.productionTip = false //阻止 vue 在启动时生成生产提示。

		new Vue({
			el:'#root',
			data:{
				name:'尚硅谷',
				str:'

你好啊!

'
, str2:'兄弟我找到你想要的资源了,快来!', } })
script> html>

Vue26 内置标签 v-text v-html_第2张图片

你可能感兴趣的:(Vue,html,前端,javascript)