可以在React中使用Polymer吗？

Question

我一直在使用React,并期待在React中使用Polymer标签.React不识别Polymer标签,因为React只处理基本的DOM标签.有没有办法将Polymer标签添加到React DOM库？

Answer 1

对的,这是可能的.

1. 创建聚合物元素.

   <link rel="import" href="../../bower_components/polymer/polymer.html">
   

   Polymer({
       is: 'calender-element',
       ready: function(){
           this.textContent = "I am a calender";
       }
   });
   

2. 通过在html页面中导入聚合物组件,使其成为html标签.例如,在您的react应用程序的index.html中导入它.

   <link rel="import" href="./src/polymer-components/calender-element.html">
   

3. 在jsx文件中使用该元素.

   'use strict';
   
   import React from 'react';
   
   class MyComponent extends React.Component{
       render(){
           return (
               <calender-element></calender-element>
           );
       }
   }
   
   export default MyComponent;
   

Answer 2

可以在React中使用Polymer吗？

简短回答:不是真的.

答案很长:有点儿.您必须创建直接创建节点和操作属性的组件.元素的孩子还有其他考虑因素等.

是否有可能在聚合物内部使用React？

这种方式几乎是相同的答案,你必须将React组件包装在聚合物元素中.

为什么？

Polymer(基于Web组件)和React(ui组件库)都基于'组件'.因为在Web中没有单一的方法来表达组件,所以您需要在各种库之间架起桥梁.对于"角度反应","反应中的jquery插件","jquery插件中的淘汰","骨架中的反应","使用骨架的聚合物元素的角度以及与使用角度的聚合物元素反应"的问题也是如此.等

在像聚合物角度的情况下,您可能认为它非常简单,但聚合物不知道评估角度表达式或任何类型的声明性回调.几乎在每种情况下你都需要一座桥梁,它们永远不会漂亮.

Answer 3

这是一个相当古老的问题,但https://www.npmjs.com/package/react-polymer怎么样？这不是聚合物组分的反应支持吗？

import reactPolymer from 'react-polymer'; //IMPORTANT: Must be imported before React.
import React from 'react';

reactPolymer.registerAttribute('raised');
reactPolymer.registerAttribute('url');
reactPolymer.registerEvent('response', 'onResponse');


<paper-button raised>another button</paper-button>
<iron-ajax url="http://example.com/" onResponse={this.handleResponse} />