QTime 组件提供了一种输入时间的方法。
¥The QTime component provides a method to input time.
用法(Usage)
¥Usage
请注意，该模型只是一个字符串。
¥Notice that the model is a String only.
基本(Basic)
¥Basic
提示
对于横屏模式，你可以结合使用 $q.screen 来使 QTime 响应式显示。示例：:landscape="$q.screen.gt.xs"。更多信息：Quasar 屏幕插件。
¥For landscape mode, you can use it along with $q.screen to make QTime responsive. Example: :landscape="$q.screen.gt.xs". More info: Quasar Screen Plugin.
功能(Functionality)
¥Functionality
24 小时制格式取决于你设置的 Quasar 语言包，但你也可以强制使用，如下例所示。
¥The 24 hour format is applied depending on the Quasar Language Pack that you’ve set, but you can also force it, like in the example below.
点击 “现在” 按钮可将时间设置为当前用户时间：
¥Clicking on the “Now” button sets time to current user time:
模型掩码(Model mask)
¥Model mask
默认模型蒙版为 HH:mm（使用 with-seconds 属性时为 HH:mm:ss），但你也可以使用自定义蒙版。
¥The default model mask is HH:mm (or HH:mm:ss when using with-seconds prop), however you can use custom masks too.
mask 属性的 token 可以在 Quasar 实用程序 > 日期实用程序 中找到。
¥The mask prop tokens can be found at Quasar Utils > Date utils.
关于服务器渲染 (SSR) 的说明
在掩码中使用 x 或 X（时间戳）可能会导致客户端出现 hydration 错误，因为解码模型字符串必须使用 new Date() 来完成，而 new Date() 会考虑本地时区。因此，如果服务器与客户端位于不同的时区，则服务器的渲染输出将与客户端上的渲染输出不同，因此 hydration 将失败。
¥Using x or X (timestamps) in the mask may cause hydration errors on the client, because decoding the model String must be done with new Date() which takes into account the local timezone. As a result, if the server is in a different timezone than the client, then the rendered output of the server will differ than the one on the client so hydration will fail.
关于波斯历法的说明
使用波斯历时，QTime 的掩码将被强制为 HH:mm 或 HH:mm:ss（如果指定了 with-seconds）。
¥When using the persian calendar, the mask for QTime is forced to HH:mm or HH:mm:ss (if with-seconds is specified).
如果你想在掩码中插入字符串（包括 [ 和 ] 字符），请确保使用 [ 和 ] 将它们括起来进行转义，否则这些字符可能会被解释为格式标记。
¥If you want to insert strings (including [ and ] characters) into your mask, make sure you escape them by surrounding them with [ and ], otherwise the characters might be interpreted as format tokens.
使用掩码将 QDate 和 QTime 连接到同一个模型：
¥Using the mask to connect a QDate and QTime to the same model:
自定义临时语言环境(Custom ad-hoc locale)
¥Custom ad-hoc locale
如果出于某种原因，你需要使用自定义的临时语言环境而不是已设置的当前 Quasar 语言包，则可以使用 locale 属性：
¥If, for some reason, you need to use a custom ad-hoc locale rather than the current Quasar Language Pack that has been set, you can use the locale prop:
着色(Coloring)
¥Coloring
限制选项(Limiting options)
¥Limiting options
你可以使用
hour-options、minute-options和second-options属性限制用户在特定时间进行选择。¥You can use the
hour-options,minute-optionsandsecond-optionsprops to limit user selection to certain times.或者，为了更深入地限制选项，你还可以为
options-fn属性提供一个函数（见下面的第二个示例）。¥Alternatively, for a more in-depth way of limiting options, you can also supply a function (second example below) to
options-fnprop.
使用 QInput(With QInput)
¥With QInput
在 QInput 上连接具有相同模型的 QDate 和 QTime：
¥Connecting a QDate and QTime with same model on a QInput:
以下是 QInput mask 和 rules 属性的辅助函数。你可以使用它们来方便使用，也可以编写指定 自定义需求 的字符串。
¥The following are helpers for QInput mask and rules props. You can use these for convenience or write the string specifying your custom needs.
属性
mask辅助函数：完整列表。¥Property
maskhelpers: full list.属性
rules辅助函数：完整列表。¥Property
ruleshelpers: full list.
示例：“date”, “time”, “fulltime”.
¥Examples: “date”, “time”, “fulltime”.
更多信息：QInput。
¥More info: QInput.
使用附加按钮(With additional buttons)
¥With additional buttons
你可以使用默认插槽添加按钮：
¥You can use the default slot for adding buttons:
原生表单提交(Native form submit)
¥Native form submit
处理具有 action 和 method 的原生表单时（例如，将 Quasar 与 ASP.NET 控制器结合使用时），你需要在 QTime 上指定 name 属性，否则 formData 将不会包含它（如果应该包含的话）：
¥When dealing with a native form which has an action and a method (eg. when using Quasar with ASP.NET controllers), you need to specify the name property on QTime, otherwise formData will not contain it (if it should):