[发明专利]一种基于微信小程序的动态图文添加组件及其实现方法

权利要求书

1.一种基于微信小程序的动态图文添加组件，包括动态图文组件，其特征在于，所述动态图文组件包括图文展示模块、图片上传模块以及文字编辑模块，所述图文展示模块、图片上传模块以及文字编辑模块的输出端电连接有动态图文组件的输入端；

所述图文展示模块用于微信小程序中展示图片和文字的；

所述图片上传模块用于微信小程序中图片的上传；

所述文字编辑模块用于微信小程序中文字的编辑。

2.一种基于微信小程序的动态图文添加组件的实现方法，其特征在于，包括以下步骤：

S1、创建组件，使图文组件呈左边显示图片，右边显示文字的形式；

S2、当页面的图文参数成功获取后，触发组件内的方法将参数传入组件并通知组件对数据进行回显，点击图片区域进行正常的图片上传操作，点击文字区域时准备文字编辑页面的跳转；

S3、随机生成一个随机数作为监听的主题，即为观察者模式，随机数作为主题的目的是防止当前组件的其他数组元素或者同一个页面的相同组件因为使用了同一个主题导致文字回显发生冲突，将主题与文字区域的文字一起作为编辑页面的参数进行页面跳转，跳转页面成功后，同时开始监听该监听主题；

S4、当文字编辑页面的文字完成编辑，触发从上一个页面传过来的主题，并把编辑好的文字作为触发主题的参数，上一个页面的监听被触发，取出触发主题操作时传入的文字参数，并把其赋值给当前页的文字区域；

S5、当点击组件上的“+”号或“-”号时，向对象数组里新添加或减少一个相同的对象，该对象可以像第一个对象一样进行图文编辑操作；

S6：每当操作一次图片区域或者文字区域，都会触发一次参数外传操作，为了防止外传的数据包含空的数组对象，对整个对象数组进行循环，如果图片区域和文字区域均没有内容，则删除数组内的该对象，循环结束后将整个对象数组外传至页面，页面只需监听数据外传的操作即可获取整个对象数组的数。

3.根据权利要求2所述的一种基于微信小程序的动态图文添加组件及其实现方法，其特征在于，所述动态添加可通过用户自行操作实现数据对象的添加和删除。

4.根据权利要求2所述的一种基于微信小程序的动态图文添加组件及其实现方法，其特征在于，所述图文添加组件是指用于展示图片和文字的基于微信小程序开发的组件。

5.根据权利要求2所述的一种基于微信小程序的动态图文添加组件及其实现方法，其特征在于，所述步骤S3中，观察者模式是软件设计模式的一种，在此种模式中，一个目标物件管理所有相依于它的观察者物件，并且在它本身的状态改变时主动发出通知。

6.根据权利要求5所述的一种基于微信小程序的动态图文添加组件及其实现方法，其特征在于，所述观察者模式，通常透过呼叫各观察者所提供的方法来实现，此种模式通常被用来实现事件处理系统。

7.根据权利要求2所述的一种基于微信小程序的动态图文添加组件及其实现方法，其特征在于，所述步骤S2中将获取的数据回显到组件，如果选择要上传的图片，即可上传图片并显示上传后的url，组件内容填充完成，即可完成图片上传。

8.根据权利要求7所述的一种基于微信小程序的动态图文添加组件及其实现方法，其特征在于，所述url为统一资源定位系统，是因特网的万维网服务程序上用于指定信息位置的表示方法，现在它已经被万维网联盟编制为互联网标准RFC1738。

9.根据权利要求2所述的一种基于微信小程序的动态图文添加组件及其实现方法，其特征在于，所述步骤S4中文字编辑页面编辑完成并失焦，触发完成编辑事件，组件监听到完成编辑事件，替换文本内容，组件内容填充完成，即可完成动态图文的添加。