Vào mã JSX và tôi đang sử dụng HTML-React-Parser. Tôi đã liên kết nó với HTML của mình như vậy: Show
Nó hoạt động tốt, nhưng vấn đề là khi tôi chạy nó, nó trả lại cho tôi một đối tượng như thế này: Và tôi không thực sự chắc chắn phải làm gì với điều này. Tất cả những gì tôi thực sự cần là một chuỗi đơn giản. Mọi sự trợ giúp sẽ rất được trân trọng. Cảm ơn trước. html-react-parser Liberapay Teepsring Giấy phép MITHTML để phản ứng phân tích cú pháp hoạt động trên cả máy chủ (Node.js) và máy khách (trình duyệt):Trình phân tích cú pháp chuyển đổi một chuỗi HTML thành một hoặc nhiều phần tử phản ứng. Mục lục
Cài đặtNPM: npm install html-react-parser --save Yarn: yarn add html-react-parser CDN: <!-- HTMLReactParser depends on React --> <script src="https://unpkg.com/[email protected]/umd/react.production.min.js"></script> <script src="https://unpkg.com/[email protected]/dist/html-react-parser.min.js"></script> <script> window.HTMLReactParser(/* string */); </script> Cách sử dụngNhập hoặc yêu cầu mô -đun: // ES Modules import parse from 'html-react-parser'; // CommonJS const parse = require('html-react-parser'); Phân tích phần tử đơn: parse('<h2>single</h2>'); Phân tích nhiều yếu tố: parse('<li>Item 1</li><li>Item 2</li>'); Đảm bảo hiển thị các phần tử liền kề được phân tích cú pháp trong phần tử cha: <ul> {parse(` <li>Item 1</li> <li>Item 2</li> `)} </ul> Các yếu tố phân tích. parse('<body><p>Lorem ipsum</p></body>'); Phần tử phân tích cú pháp với các thuộc tính: const parse = require('html-react-parser'); parse('<p>Hello, World!</p>'); // React.createElement('p', {}, 'Hello, World!')0 thay thếTùy chọn yarn add html-react-parser4 cho phép bạn thay thế một phần tử bằng một phần tử khác. Đối số đầu tiên của yarn add html-react-parser4 là nút của DomHandler: const parse = require('html-react-parser'); parse('<p>Hello, World!</p>'); // React.createElement('p', {}, 'Hello, World!')1 Đầu ra bảng điều khiển: const parse = require('html-react-parser'); parse('<p>Hello, World!</p>'); // React.createElement('p', {}, 'Hello, World!')2 Phần tử được thay thế nếu phần tử phản ứng hợp lệ được trả về:valid React element is returned: const parse = require('html-react-parser'); parse('<p>Hello, World!</p>'); // React.createElement('p', {}, 'Hello, World!')3 Thay thế bằng TypeScriptĐối với các dự án TypeScript, bạn có thể cần kiểm tra xem yarn add html-react-parser9 có phải là một thể hiện của <!-- HTMLReactParser depends on React --> <script src="https://unpkg.com/[email protected]/umd/react.production.min.js"></script> <script src="https://unpkg.com/[email protected]/dist/html-react-parser.min.js"></script> <script> window.HTMLReactParser(/* string */); </script>0 của Domhandler: const parse = require('html-react-parser'); parse('<p>Hello, World!</p>'); // React.createElement('p', {}, 'Hello, World!')4 Nếu bạn đang gặp sự cố, hãy xem ví dụ về ứng dụng Created React của chúng tôi. Thay thế yếu tố và trẻ emThay thế các thuộc tính phần tử const parse = require('html-react-parser'); parse('<p>Hello, World!</p>'); // React.createElement('p', {}, 'Hello, World!')5 thay thế và xóa phần tử const parse = require('html-react-parser'); parse('<p>Hello, World!</p>'); // React.createElement('p', {}, 'Hello, World!')6 Thay thế các thuộc tính phần tửthay thế và xóa phần tử const parse = require('html-react-parser'); parse('<p>Hello, World!</p>'); // React.createElement('p', {}, 'Hello, World!')7 thay thế và xóa phần tử const parse = require('html-react-parser'); parse('<p>Hello, World!</p>'); // React.createElement('p', {}, 'Hello, World!')8 thay thế và xóa phần tửthư viện const parse = require('html-react-parser'); parse('<p>Hello, World!</p>'); // React.createElement('p', {}, 'Hello, World!')9 thay thế và xóa phần tử thư việnCắtReact. Di cư Câu hỏi thường gặpXSS này có an toàn không? npm install html-react-parser --save1 HTML không hợp lệ có được vệ sinh không?
Thuộc tính không được gọi Trình phân tích cú pháp ném lỗi npm install html-react-parser --save2 CắtDi cư npm install html-react-parser --save3 Câu hỏi thường gặp npm install html-react-parser --save4 XSS này có an toàn không? npm install html-react-parser --save5 HTML không hợp lệ có được vệ sinh không? npm install html-react-parser --save6 Các thẻ yarn add html-react-parser5 có được phân tích cú pháp không?v3.0.0Thuộc tính không được gọi v2.0.0Trình phân tích cú pháp ném lỗi v1.0.0SSR có được hỗ trợ không? Các yếu tố không được lồng chính xác npm install html-react-parser --save7 Không thay đổi trường hợp thẻ Lỗi TS: Thuộc tính 'Attribs' không tồn tại trên loại 'domnode'XSS này có an toàn không?HTML không hợp lệ có được vệ sinh không?not XSS (cross-site scripting) safe. See #94. HTML không hợp lệ có được vệ sinh không?Các thẻ yarn add html-react-parser5 có được phân tích cú pháp không?not sanitize HTML. See #124, #125, and #141. Thuộc tính không được gọiTrình phân tích cú pháp ném lỗi Thuộc tính không được gọiTrình phân tích cú pháp ném lỗi Trình phân tích cú pháp ném lỗiSSR có được hỗ trợ không? SSR có được hỗ trợ không?Các yếu tố không được lồng chính xác Các yếu tố không được lồng chính xácKhông thay đổi trường hợp thẻ npm install html-react-parser --save8 Lỗi TS: Thuộc tính 'Attribs' không tồn tại trên loại 'domnode' Không thay đổi trường hợp thẻLỗi TS: Thuộc tính 'Attribs' không tồn tại trên loại 'domnode' npm install html-react-parser --save9
Webpack xây dựng cảnh báo Lỗi TS: Thuộc tính 'Attribs' không tồn tại trên loại 'domnode'Tôi có thể bật yarn add html-react-parser6 cho các yếu tố nhất định không? Webpack xây dựng cảnh báoMàn biểu diễn Webpack xây dựng cảnh báoMàn biểu diễn yarn add html-react-parser1 Người đóng góp yarn add html-react-parser2 Người đóng góp mã Màn biểu diễnNgười đóng góp Người đóng góp mã yarn add html-react-parser3 Giới hạn kích thước chạy: Người đóng gópNgười đóng góp mãDự án này tồn tại nhờ tất cả những người đóng góp.[Đóng góp]. Người đóng góp tài chínhTrở thành người đóng góp tài chính và giúp chúng tôi duy trì cộng đồng của chúng tôi.[Đóng góp] Cá nhânTổ chứcHỗ trợ dự án này với tổ chức của bạn.Logo của bạn sẽ hiển thị ở đây với một liên kết đến trang web của bạn.[Đóng góp] Doanh nghiệpCó sẵn như một phần của đăng ký Tidelift. Người bảo trì HTML-Reac-Parser và hàng ngàn gói khác đang làm việc với Tidelift để cung cấp hỗ trợ và bảo trì thương mại cho các gói nguồn mở mà bạn sử dụng để xây dựng các ứng dụng của mình.Tiết kiệm thời gian, giảm rủi ro và cải thiện sức khỏe của mã, trong khi trả cho người bảo trì các gói chính xác bạn sử dụng.Tìm hiểu thêm. Ủng hộ
Giấy phépMIT |
