从Qt地图应用软件开发（二）Qt与Js交互实现中，我们可以了解到，Qt与网页数据交互的通道是Qt WenChannel。这篇文章，我们将关注如何向网页传递数据，以及从网页获取数据。

Qt与网页（Js）进行数据交路

数据主要可以概括为两种:

• 单个的数据，如一个string、int；
• 结构化的数据， 如{月，日，年}；
  传递数据，可以使用Q_PROPERTY宏，该宏的原型为：

Q_PROPERTY(type name
            (READ getFunction [WRITE setFunction] |
             MEMBER memberName [(READ getFunction | WRITE setFunction)])
            [RESET resetFunction]
            [NOTIFY notifySignal]
            [REVISION int]
            [DESIGNABLE bool]
            [SCRIPTABLE bool]
            [STORED bool]
            [USER bool]
            [CONSTANT]
            [FINAL]
            [REQUIRED])

需要注意的是，该宏只有在继承了QObject的类中才可以使用。下面我们来看一下，宏中相应关键字的说明。

传递单一属性数据

我们直接来看具体的示例:

    Q_PROPERTY(qreal spacing MEMBER m_spacing NOTIFY spacingChanged)
signals:
    void spacingChanged();
private:
    qreal m_spacing;

这样我们通过使用MEMBER 关键字，将成员变量导出为Qt的属性。当m_spacing改变的时候便会发出一个spacingChanged信号，我们可以通过该信号，将Qt的成员变量与Js连接起来。下面在HTML文件中修改：

<script src="qwebchannel.js"></script> 
  <script type="text/javascript">
  new QWebChannel(qt.webChannelTransport,
  function(channel){
  var webobj = channel.objects.webobj;
  window.foo= webobj;
  webobj.spacingChanged.connect(update);
  });
  </script>

channel.objects.webobj中的webobj是我们在Qt中定义的QWebChannel的实例对象，之后通过webobj.spacingChanged.connect(update);将信号spacingChanged和Js中的处理函数update连接了起来。
这样我们便将Qt中的变量与Js连接在了一起，同时Js也可以直接对类中的m_spacing进行赋值等操作。

传递结构体数据

结构化的数据不能够使用结构体直接传递过去，但可以使用Json进行传递。因此，我们可以使用QJsonObject对数据进行封装，之后使用Q_PROPERTY宏，将对象转化为Qt属性。

QJsonObject简介

JSON是一种对源自Javascript的对象数据进行编码的格式，但现在被广泛用作互联网上的一种数据交换格式。

• JSON对象是键值对的列表，其中键是惟一的字符串，值由QJsonValue表示。
• QJsonObject可以与QVariantMap相互转换。可以使用size()、insert() 和remove()条目查询(键，值)对的数量，并使用标准的c++迭代器模式对其内容进行迭代。
• QJsonObject是一个隐式共享类，只要文档没有被修改，它就与创建它的文档共享数据。
• 可以通过QJsonDocument将对象与基于JSON的文本进行转换。