이런 문자로 시작하는 텍스트가 있어요
도망치고 싶지 않지만 나머지 끈은 도망치고 싶어
Vue, 지정text = " <strong>something</strong>"
할 경우:
<p>{{ text }}</p>
이 명령어는 다음을 포함한 모든 텍스트를 생략합니다.
, 출력:
<strong> 무엇인가 </strong>
이렇게 하면:
<p v-html="text"></p>
그 후, 다음과 같이 됩니다.
뭔가
내가 성취하고 싶은 것은 탈출하지 않는 것이다.
HTML의 나머지 부분은 모두 빠져나갑니다.내 생각은 다음과 같았다.
<p v-html="formatText()"></p> <script> methods: {
formatText() {
return ' ' + e('<strong>something</strong>');
} } </script>
어디에e
원치 않는 html을 벗어나는 함수일 수 있습니다.
Vue에게 그런 방법이 있나요?아니면 제가 작성해야 하는 건가요?나는 Vue가 어떻게 후드 아래로 탈출하는지 잘 모르겠다.
질문에 대한 답변
다음을 사용하여 이를 달성할 수 있습니다.RegEx
방법의 도움을 받아 들이다
라이브 데모:
new Vue({
el: '#app',
data: {
text: ' <strong>something</strong>'
},
mounted() {
this.text = this.text.replace(/[^ ].*/, '');
} })
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script> <div id="app">
<p>{{ text }}</p> </div>
Vue가 네이티브로 이 작업을 수행할 수 있는 방법을 아직 찾지 못했습니다.하지만 그동안 저는 다음과 같은 일을 했습니다.
<p v-for="line in messageLines">
<span v-html="extractIndent(line)"></span>{{ line.trim() }} </p>
<script> methods: {
extractIndent(line) {
let indent = '';
for (let i = 0; i < line.length; i++) {
if (line.charAt(i) === ' ') {
indent += ' ';
} else {
break;
}
}
return indent;
} } </script>
이렇게 하면 ” 들여쓰기된 텍스트”와 같은 텍스트가 공백으로 변환됩니다.
그리고 그것들을 그 안에 넣어요<span>
이스케이프를 해제하고 Vue의 괄호를 사용하여 나머지 텍스트를 모두 이스케이프합니다.
지금 내가 필요한 건 충분해.