navigator组件（react native 之Navigator组件可选参数属性navigationBar 怎么使用）

本文目录

• react native 之Navigator组件可选参数属性navigationBar 怎么使用
• 使用拖拽组件，vue-draggble，火狐浏览器的兼容问题
• 微信小程序_组件
• 程序开发中常用的组件是什么
• 什么是数据库生成数据的基本组件
• 微信小程序---tabBar&页面跳转

react native 之Navigator组件可选参数属性navigationBar 怎么使用

当然可以了，不过相当的麻烦，可以百度找教程来做，我试过一次没有成功，不过网上有人说成功的，而且react native的Android刚出来两个月，资料少的可怜啊，还是等等吧。

使用拖拽组件，vue-draggble，火狐浏览器的兼容问题

vue中使用拖拽组件，在谷歌 ie浏览器拖拽都没有问题，火狐浏览器拖拽时 会默认打开浏览器新窗口，所以在生命周期created时 禁掉

created() {
    let userAgent = navigator.userAgent; //取得浏览器的userAgent字符串

    if (userAgent.indexOf("Firefox") 》 -1) { //火狐浏览器需要禁掉默认的拖拽事件

        document.body.ondrop = (e)=》{ //拖拽结束事件

            if(this.dragging) { //当前页面正在拖拽中，阻止默认事件

                e.preventDefault(); //阻止浏览器默认行为，主要是为了解决火狐浏览器拖拽完打开新的窗口问题

                e.stopPropagation();

            }

        }

    }

},

3

微信小程序_组件

1.基础组件：

什么是组件：
《ul》
《li》组件是视图层的基本组成单元。《/li》
《li》组件自带一些功能与微信风格的样式。《/li》
《li》一个组件通常包括开始标签
和结束标签
，属性
用来修饰这个组件，内容
在两个标签之内。《/li》
《/ul》

2.属性类型
《ul》
《li》Boolean 布尔值 组件写上该属性，不管该属性等于什么，其值都为true
，只有组件上没有写该属性时，属性值才为false
。如果属性值为变量，变量的值会被转换为Boolean类型《/li》
《li》Number 数字 1
, 2.5《/li》
《li》String 字符串 "string"《/li》
《li》Array 数组 《/li》
《li》Object 对象 { key: value } 《/li》
《li》EventHandler 事件处理函数名 "handlerName"
是 Page中定义的事件处理函数名《/li》
《li》Any 任意属性 《/li》
《/ul》

3.共同属性类型

id , class , style , hidden , data-* , bind* / catch*

4.特殊属性

几乎所有组件都有各自定义的属性，可以对该组件的功能或样式进行修饰

5.组件列表

基础组件分为以下八大类：

视图容器(View Container)：
view 视图容器 , scroll-view 可滚动视图容器, swiper 滑块视图容器

基础内容(Basic Content)：
icon 图标, text 文字, progress 进度条

表单(Form)：
button 按钮, form 表单， input 输入框， checkbox 多想选择器, radio 单选器， picker 列表选择器, slider 滚动选择器, switch 开关选择器, label 标签.
操作反馈（Interaction）
action-sheet 上拉菜单
modal 模态弹窗
toast 消息提示框
loading 加载提示符

导航Navigation

navigator 应用链接

多媒体(Media)

audio 音频, image 图片， video 视频
** 地图 **

map 地图

画布Canvas
canvas 画布

flex: vt.折曲，使收缩； vi.玩去，收缩

程序开发中常用的组件是什么

:
　　　　开发者可以利用微信团队提供的框架中的一系列基础组件进行快速的开发，什么是组件？
组件是视图层的基本组成单元。
组件自带一些功能与微信风格的样式。
一个组件通常包括开始标签和结束标签，属性用来修饰这个组件，内容在两个标签之间。
　　形式:
　　　　
　　　　　Content goes here
　　　　
　　例如:
组件的属性
　　　　所有组件的属性都是小写，以连字符"-"连接
属性类型:每个组件的属性是分不同的类型的
公共属性:所有的主键都有的属性
特殊属性
　　1.属性的类型
　　
　　2.共同属性
　　
　　3.特殊属性
　　几乎所有组件都有各自定义的属性，可以对该组件的功能或样式进行修饰。
组件及类型的说明
组件名称组件类型组件说明
view视图容器视图容器
scroll-view视图容器可滚动视图容器
swiper视图容器滑块视图容器
icon基础内容图标
text基础内容文字
progress基础内容 进度条
button表单 按钮
form表单 表单
input表单 输入框
checkbox表单 多项选择器
radio表单 单项选择器
picker表单 列表选择器
picker-view表单 内嵌列表选择器
slider表单 滚动选择器
switch表单 开关选择器
label表单标签
navigator 导航应用连接
audio多媒体音频
image多媒体图片
video 多媒体 视频
map 地图地图
canvas画布画布
contact-button客服会话进入客服会话按钮
实例理解组件属性
　　在根目录下创建如下的页面目录
　　
　　然后在mypages.wxss文件中添加button1的样式如下
　　
/* mypages.wxss */
.button1{
width: 256rpx;
height: 128rpx;
}
　　然后在mypages.wxml文件中添加如下代码
　　
我的第一个微信小程序
按钮
　　其中，主要是看button这个按钮控件，其中的属性id 由前面可知是string类型的，所以这个属性的格式为 属性名称="自定义字符串"，class也是string类型的属性，所以格式相同，后面的bingdtap属性就是之前所介绍过的组件的事件，在这个按钮组件中点击按钮，就会出发bindtap属性所指向的在myages.js中对应的名字为"anyfunction"的方法。
　　点击左侧编译后查看效果如下
　　boolean类型的属性，只要写了属性名，那值就是为true，例如
我的第一个微信小程序
按钮
　　其中只要写了hidden这个类型是boolean类型的属性名字，那这个属性就是生效的,运行效果如下，按钮被隐藏:

什么是数据库生成数据的基本组件

一、Session组件。它提供应用程序中数据库的有关信息，在单机数据库编程中不显式地使用它，这是因为每个数据库应用程序运行时，Delphi将自动创建一个缺省Session组件，用户可在程序中使用这个缺省的Session组件，而没有必要在设计时设置一个Session组件。

二、DBNavigator组件。DBNavigator组件主要用于为用户操作数据集中的记录提供简捷的控制按钮。用户单击其中的按钮就可完成移动记录指针、插入、删除、修改、保存、刷新记录等功能。

三、DBtext组件。相当于标签（Label）组件，只不过它用于显示数据库中的字段值，其显示内容随记录指针的变化而变化。它的DataField属性指定要显示内容的字段名称。

四、DBEdit组件。用于显示、修改数据表字段值。由于DBEdit一般用来修改或添加新记录使用，所以其ReadOnly属性一般设定为False，若设定为True则不可修改字段内容。

数据库(Database)是按照数据结构来组织、存储和管理数据的仓库，它产生于距今六十多年前，随着信息技术和市场的发展，特别是二十世纪九十年代以后，数据管理不再仅仅是存储和管理数据，而转变成用户所需要的各种数据管理的方式。数据库有很多种类型，从最简单的存储有各种数据的表格到能够进行海量数据存储的大型数据库系统都在各个方面得到了广泛的应用。

微信小程序---tabBar&页面跳转

1、tabBar

在app.json文件中添加tabBar节点。tabBar是小程序客户端底部或顶部tab栏的实现。
（1）tabBar相关属性

color：tab上的文字默认颜色，仅支持十六进制颜色。

selectedColor：tab上的文字选中时的颜色，仅支持十六进制颜色。

backgroundColor：tab的背景色，仅支持十六进制颜色。

borderStyle：tabbar上边框的颜色， 仅支持 black / white。

position：tabBar的位置，默认值是: bottom，仅支持 bottom / top。当 position 为 top 时，不显示 icon。

custom：自定义tabBar。

"tabBar": {

    "color": "#000000",

    "selectedColor": "#336699",

    "backgroundColor": "#ffffff",

    "borderStyle": "black",

    "position": "bottom"

  }

（2）list

list：tab的列表。

list 接受一个数组，只能配置最少 2 个、最多 5 个 tab。

pagePath：页面路径，必须在pages 中先定义。

text：tab 上按钮文字。

iconPath：图片路径，icon 大小限制为 40kb，建议尺寸为 81px * 81px，不支持网络图片。selectedIconPath：选中时的图片路径，icon 大小限制为 40kb，建议尺寸为 81px * 81px，不支持网络图片。

    "list": [

      {

        "text": "首页",

        "pagePath": "pages/index/index",

        "iconPath": "assets/icon/home.png",

        "selectedIconPath": "assets/icon/home2.png"

      },

      {

        "text": "列表",

        "pagePath": "pages/list/list",

        "iconPath": "assets/icon/list.png",

        "selectedIconPath": "assets/icon/list2.png"

      }

]

2、页面跳转

（1）跳转普通页面

方法① navigator组件

 《!-- 跳转到普通页，可以通过返回按钮返回 --》

 《navigator url="../detail/detail"》到详情页《/navigator》

方法② navigateTo()方法

navigateTo()方法，用于跳转普通页面。

《view bindtap="gotoDetail"》到详情页《/view》
gotoDetail(){

    //使用全局api跳转，navigateTo()方法，用于跳转普通页面

    wx.navigateTo({

      url: ’../detail/detail’,

    })

   }

（2）跳转tabBar页面

方法① navigator组件

如果要使用navigator组件跳转tabBar页面，需要设置open-type="switchTab"。

 《!-- 跳转到tabBar页面，不可以通过返回按钮返回。因为跳转到指定的tabBar页面后，会关闭其他所有页面 --》

《navigator url="../list/list" open-type="switchTab"》到列表页《/navigator》                                                                                      

方法② switchTab()方法

switchTab()方法，用于跳转tabBar页面。
  《view bindtap="gotoList"》到列表页《/view》

gotoList(){

    wx.switchTab({

      url: ’../list/list’,

    })

  }