pan_h1995
pan_h1995

【狂神说Java】Vue学习笔记03-----基础语法指令

本文根据B站【狂神说Java】vue系列视频整理，如需观看视频，请点击链接跳转
【狂神说Java】Vue视频

1、v-bind

  我们已经成功创建了第一个Vue应用!看起来这跟渲染一个字符串模板非常类似， 但是Vue在背后做了大量工作。现在数据和DOM已经被建立了关联， 所有东西都是响应式的。我们在控制台操作对象属性，界面可以实时更新!
  我们还可以使用v-bind来绑定元素特性!
  上代码


<html lang="en" xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>Titletitle>

head>
<body>


<div id="app">
    <span v-bind:title="message">
    鼠标悬停几秒钟查看此处动态绑定的提示信息！
  span>
div>


<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.min.js">script>
<script type="text/javascript">
    var vm = new Vue({
        el:"#app",
        /*Model：数据*/
        data:{
            message: '页面加载于 ' + new Date().toLocaleString()
        }
    });
script>
body>
html>

  你看到的v-bind等被称为指令。指令带有前缀v以表示它们是Vue提供的特殊特性。可能你已经猜到了， 它们会在渲染的DOM上应用特殊的响应式行为在这里，该指令的意思是：“将这个元素节点的title特性和Vue实例的message属性保持一致”。
  如果你再次打开浏览器的JavaScript控制台， 输入app， message=‘新消息’，就会再一次看到这个绑定了title特性的HTML已经进行了更新。

2、v-if， v-else

什么是条件判断语句，就不需要我说明了吧，以下两个属性!

  • v-if
  • v-else

  上代码


<html lang="en" xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>Titletitle>
head>
<body>

<div id="app">
    <h1 v-if="ok">Yesh1>
    <h1 v-else>Noh1>
   
div>


<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.min.js">script>
<script type="text/javascript">
    var vm = new Vue({
        el:"#app",
        /*Model：数据*/
        data:{
            type: true
        }
    });
script>
body>
html>

  测试：
1.在浏览器上运行，打开控制台!
2.在控制台输入vm.ok=false然后回车，你会发现浏览器中显示的内容会直接变成NO
  注：使用v-*属性绑定数据是不需要双花括号包裹的

v-else-if

  • v-if
  • v-else-if
  • v-else
      注：===三个等号在JS中表示绝对等于(就是数据与类型都要相等)上代码：

<html lang="en" xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>Titletitle>
head>
<body>

<div id="app">
    <h1 v-if="type==='A'">Ah1>
    <h1 v-else-if="type==='B'">Bh1>
    <h1 v-else-if="type==='D'">Dh1>
    <h1 v-else>Ch1>

div>


<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.min.js">script>
<script type="text/javascript">
    var vm = new Vue({
        el:"#app",
        /*Model：数据*/
        data:{
            type: 'A'
        }
    });
script>
body>
html>

3、v-for

  • v-for

格式说明

<div id="app">
    <li v-for="(item,index) in items">
        {{item.message}}---{{index}}
    li>

div>

  注：items是数组，item是数组元素迭代的别名。我们之后学习的Thymeleaf模板引擎的语法和这个十分的相似！
  上代码：


<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Titletitle>
head>
<body>

<div id="app">
    <li v-for="(item,index) in items">
        {{item.message}}---{{index}}
    li>

div>


<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.min.js">script>
<script type="text/javascript">
    var vm = new Vue({
        el:"#app",
        /*Model：数据*/
        data:{
            items:[
                {message:'狂神说Java'},
                {message:'狂神说前端'},
                {message:'狂神说运维'}
            ]
        }
    });
script>
body>
html>

  测试：在控制台输入vm.items.push({message：'狂神说运维'})，尝试追加一条数据，你会发现浏览器中显示的内容会增加一条狂神说运维.
v-on
  v-on监听事件
 emsp;事件有Vue的事件、和前端页面本身的一些事件!我们这里的click是vue的事件， 可以绑定到Vue中的methods中的方法事件!
  上代码：


<html lang="en" xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>Titletitle>
head>
<body>

<div id="app">
    <button v-on:click="sayHi">点我button>
div>

<script src="../js/vue.js">script>
<script type="text/javascript">
    var vm = new Vue({
        el:"#app",
        data:{
            message:'Hello World'
        },
        methods:{
            sayHi:function(event){
                //'this'在方法里面指向当前Vue实例
                alert(this.message);
            }
        }
    });
script>
body>
html>

  点击测试
  Vue还有一些基本的使用方式， 大家有需要的可以再跟着官方文档看看， 因为这些基本的指令几乎我们都见过了，一通百通!掌握学习的方式!

你可能感兴趣的:(Vue学习笔记)

  • vue学习笔记——关于对Vue3 ref(), toRef(), toRefs(), unref(), isRef(), reactive()方法的理解。 chen_sir_sh vue学习笔记javascript前端vue
    VUE3出现了很多新的API，下面是自己的一些理解进行的总结。欢迎大家一起交流补充。ref()使用ref创建一个数据类型，ref有value这个属性constname1={age:"14",name:"bob1"};constname2=ref({name:"bob2"});//使用ref创建一个数据类型相对于reactive，ref有value属性name2.value="bob3"consol
  • Vue学习笔记 一 涔溪 vuevue.js学习笔记
    Vue学习笔记1、Vue基础指令1.1什么是Vue?Vue.js是一套响应式的JavaScript开发库。Vue.js自问世以来所受关注度不断提高，在现在的市场上，Vue.js是非常流行的JavaScript技术开发框架之一。Vue是一款国产前端框架，它的作者尤雨溪（EvanYou）是一位美籍华人，2014年2月，尤雨溪开源了一个前端开发库Vue.js，2015年发布1.0.0版本，2016年4月
  • VUE学习笔记—Vue运行时渲染 前端姑娘 VUEvue.js前端javascript
    前言有一个需求：能不能让用户自制组件，从而达到定制渲染某个区域的目的。在线DOME预览大致说一下项目的背景：我们做了一个拖拉拽生成界面的系统，通过拖拽内置的组件供用户定制自己的界面，但毕竟内置的组件有限，可定制性不高，那么给用户开放一个自定义代码组件，让用户自己通过写template+js+css的方式自由定制岂不是妙哉。那么该怎么实现呢？我们先来看一vue官方的介绍很多时候我们貌似已经忽略了渐进
  • Vue学习笔记-组件通信 赵客缦胡缨v吴钩霜雪明
    最近公司需要开发酒店客房管理的OTA系统，我们使用vue.js2.0+ElementUI开发时，就遇到了问题:一个页面有很多表单,我试图将表单写成一个单文件组件,但是表单(子组件)里的数据和页面(父组件)按钮交互的时候,vue组件之间的通信让我感到崩溃:点击importdialogfrom'./components/dialog.vue'exportdefault{data(){return{sh
  • vue学习笔记:v-model指令的修饰符 子非余不知渔之乐 web前端vue学习笔记vue
    v-model指令的修饰符有三个，分别是：1.number作用：自动将用户的输入值转为数值类型。示例：2.trim作用：自动忽略输入内容的首尾空白字符示例：3.lazy作用：双向绑定时，当光标离开时才更新对应的变量示例：
  • vue学习笔记 北京理工大学软件工程 vue.js学习笔记
    通常，使用VueCLI（Vue的命令行工具）来创建Vue.js项目会自动生成package.json文件。如果你没有使用VueCLI或者其他类似工具，那么可能需要手动创建这个文件。以下是一些建议的步骤，帮助你解决这个问题：确认你使用的是VueCLI：确保你使用的是VueCLI来创建项目。你可以通过运行vue--version来检查VueCLI是否已经安装以及安装的版本。使用VueCLI创建项目：如
  • 【Vue学习笔记】尚硅谷Vue2.0+Vue3.0全套教程丨vue.js从入门到精通 丁咚Dingdong 学习笔记前端Vue2.xVue3.0Vue
    尚硅谷Vue2.0+Vue3.0全套教程丨vue.js从入门到精通Vue2.0部分1.Vue核心部分1.1Vue简介1.1.1Vue是什么？1.1.2Vue作者1.1.3Vue的特点1.1.4Vue学习的JavaScript前备知识点1.1.5Vue使用指南1.1.6搭建Vue开发环境1.2初识Vue1.2.1Hello小实例1.2.2分析Hello案例1.3Vue模板语法1.4数据绑定1.5el
  • Vue学习笔记（三）常用指令、生命周期 老李笔记 vuevue指令vue生命周期vue常用指令
    Vue学习笔记（三）常用指令vue指令：html标签上带有v-前缀的特殊属性，不同的指令具有不同的含义，可以实现不同的功能。常用指令：指令作用v-for列表渲染，遍历容器的元素或者对象的属性v-bind为html标签绑定属性值，如设置href，css样式等v-if/v-else-if/v-else条件性的渲染某元素，判定为true时渲染，否则不渲染v-show根据条件展示某元素，区别在于切换的是d
  • vue学习笔记 张豆豆94 【HBuilder学习篇】前端uni-appvue
    组件通信prop是用于父组件向子组件传递数据。$ref是父组件调用子组件的属性和方法。$emit是子组件告知父组件调用父组件的方法并可以从子组件传递参数到父组件。父组件（使用公共组件的地方）这是父组件importMyComponentfrom'@/components/my-component/my-component.vue';exportdefault{components:{MyCompon
  • vue学习笔记——计算属性传参 小怪兽_v 学习
    首先，计算属性，它是被当做属性来用的，一般不给它传参，直接接收它返回的值,但是有时候开发过程中不得不去传参来获取特定的值，可是直接往计算属性中传参根本没用，所以最后考虑到一个折中的办法，那就是返回一个回调函数,此时调用计算属性时给它传递的参数就到了回调函数中：computed:{showZT_top(){return(index)=>{returnindex*2}}}但是这样也是有弊端的，以返回函
  • VUE学习笔记 父子组件传值 刀钝刃乏
    父组件通过props向下传递数据给子组件；子组件通过events给父组件发送消息。子组件向父组件传值子组件使用this$emit（'自定义事件名',要传送的数据）向父组件传递数据。1.template模块里面直接使用this$emit（'自定义事件名',要传送的数据）2.事件里面使用this$emit，使代码结构更清晰//这是子组件editData.vue$emit('saveEdit',this
  • Vue学习笔记5--前端工程化 UtilMan
    前端工程化完整的基础篇笔记PDF下载，完全手打有用的话请给个赞呗Thanks♪(･ω･)ﾉ模块化相关规范概述传统开发问题命名冲突文件依赖模块化含义：把单独的一个功能封装到一个模块（文件）中,模块之间相互隔离，可以通过特定的接口公开内部成员，也可以依赖别的模块好处：方便代码重用，提升开发效率，方便后期维护浏览器端模块化规范AMD（Require.js）CMD（Sea.js）服务器端模块化规范Comm
  • vue学习笔记 -SkyBlue-
    Vue1.webpack4配置文件consthtmlWebpackPlugin=require('html-webpack-plugin');constVueLoaderPlugin=require('vue-loader/lib/plugin');//打包提取cssconstExtractTextPlugin=require("extract-text-webpack-plugin");//混淆
  • Vue学习笔记：计算属性 HadesNyx vue.js学习笔记
    计算属性入门进阶二次进阶三次进阶四次进阶结界五次进阶六次进阶七次进阶八次进阶九次进阶终章彩蛋入门Vue.js中，计算属性示例：exportdefault{data(){return{firstName:'John',lastName:'Doe'};},computed:{//计算属性：全名fullName(){returnthis.firstName+''+this.lastName;}}}在这个
  • Vue学习笔记之组件基础 Three Big Stones vue.js学习笔记
    1、组件的定义一般将Vue组件定义在一个单独的.vue文件中，称做单文件组件；当然也可以将组件直接定义在js文件中，如下js代码，定义一个组件BlogPost，通过props定义对外暴露属性title，父组件传递title，子组件根据title渲染html内容。exportdefault{props:['title'],template:`{{title}}`}2、组件的使用首先需要引用组件，语法
  • vue学习笔记之项目工程化开发 我真卷不动啦。。。 vue学习笔记学习笔记
    一：介绍及使用：二：脚手架目录文件介绍：三：项目运行流程：3.1main.js文件和App.vue文件之间的关系：main.js文件：main.js是Vue项目的主入口文件，负责初始化Vue应用并挂载根组件。在main.js中，首先会引入Vue库，并创建一个Vue实例。通过newVue()可以传入一个配置对象，其中可以指定挂载的DOM元素、路由、状态管理等。在创建Vue实例时，通过render函数
  • Vue学习笔记 沈姐姐~ vuevue.js学习前端
    目录1.Object.defineProperty()2.计算属性3.监视属性4.computed和watch的区别5.双向数据绑定6._el和data的俩种写法7.事件修饰符8.键盘事件9.条件渲染10.列表过滤11.过滤器12.常用指令13.生命周期14.组件15.ref属性16.props配置17.mixin属性18.vue中的插件19.WebStorage20.消息的发布与订阅20.Vue
  • Vue学习笔记之模板引用 Three Big Stones vue.js学习笔记
    1、添加模板引用对DOM元素添加引用，语法格式，则在DOM元素挂载成功后，可以通过this.$refs.input的语法形式访问引用的input元素。2、v-for中的模板引用对列表元素添加引用，语法格式{{item}}，则在DOM元素挂载成功后，可以通过this.$refs.items的语法形式访问所有的li元素。3、函数模板引用可以对DOM元素添加函数模板引用，则在组件每次更新时自动触发函数执
  • 【前端】Vue学习笔记 myaijarvis 前端vuevue
    loader版本"less":"^4.0.0","less-loader":"^7.0.0",(8以下均可)常见问题组件不显示1.template中的内容必须包含在一个div中。2.组件名称渲染时不可为HTML标签，例如header、footer等等如需使用，只要和标签名不一样就行，比如Header、Footer等等快捷键1.vdatadata(){return{key:value}},2.vco
  • Vue学习笔记14 --自定义hook函数/toRef/provide/inject等 jxncxgx Vue前端vue.js学习笔记
    9.自定义hook函数什么是hook？——本质是一个函数，把setup函数中使用的CompositionAPI进行了封装。类似于vue2.x中的mixin。自定义hook的优势:复用代码,让setup中的逻辑更清楚易懂。10.toRef作用：创建一个ref对象，其value值指向另一个对象中的某个属性。语法：constname=toRef(person,'name')应用:要将响应式对象中的某个属
  • Vue 学习笔记 -- 5. vue-router lingchen0522 Vue学习之路vue.js前端
    Vue学习笔记–5.vue-router5.vue-router一个路由（route）就是一组映射关系（key-value），多个路由需要路由器（router）进行管理。前端路由：key是路径，value是组件。5.1基本使用安装vue-router，命令：npmivue-router引入并应用插件：importrouterfrom'./router'Vue.use(vueRouter)编写rou
  • vue学习笔记 zyl熬夜之路 vue笔记vue.js学习笔记
    vue学习笔记vue框架介绍Vue.js（读音/vju：/，发音类似于view）是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue采用自底向上增量开发的设计。Vue的核心库只关注视图层，并且非常容易学习，也非常容易与其他库或已有项目整合。Vue完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。Vue.js还提供了MVVM数据绑定和一个可组合的组件系统，具有简单、
  • Vue学习笔记六 神里の凌华 vue.js学习javascript
    前端工程化一、模块化相关规范1.模块化概述传统开发模式的主要问题①命名冲突②文件依赖通过模块化解决上述问题模块化就是把单独的一个功能封装到一个模块（文件）中，模块之间相互隔离，但是可以通过特定的接口公开内部成员，也可以依赖别的模块模块化开发的好处：方便代码的重用，从而提升开发效率，并且方便后期的维护2.浏览器端模块化规范1.AMDRequire.js(http://www.requirejs.cn
  • Vue学习笔记：将数组数据使用Excel表格导出 前端互助会 Vue学习笔记vueexcel前端
    Vue学习笔记：将数组数据使用Excel表格导出需求：数组数据使用Excel导出第一步：下载依赖命令行：npmixlsx第二步：建立下载公共jssrc下建立文件夹utils后建立data2Excel.js第三步：将公共js导入页面import{dataConversionUtil}from'@/utils/data2Excel'第四步：数组数据组装Excel表格表头loadExcel(){vard
  • Vue学习笔记（一） fancy努力闯关 为毕设拼命vue.js学习javascriptecmascript
    备注：为了毕设紧急学习的个人笔记，不是为了总结分享···es6模块化每个js都是独立的模块，import导入其他模块成员，export向外共享模块成员【附上b站vue视频的具体位置】铺垫知识-03.ES6模块化-默认导...P230-00:16·模块化语法1.默认导出：exportdefault，里面的才是能从外头访问到的成员→每个模块只能有一次exportdefault！！！2.默认导入：i
  • Vue 学习笔记 称霸幼儿园18 Vuevue.js学习javascript
    Vue学习笔记1前端工程化与webpack1.1前端工程化1.1.1实际的开发模块化（js的模块化、css的模块化、资源的模块化）组件化（复用现有的UI结构、样式、行为）规范化（目录结构的划分、编码规范化、接口规范化、文档规范化、Git分支管理）自动化（自动化构建、自动部署、自动化测试）1.1.2什么是前端工程化前端工程化指的是：在企业级的前端项目开发中，把前端开发所需要的工具、技术、流程、经验等
  • Vue学习笔记（一）JS导入导出 老李笔记 js导入导出vue学习笔记
    Vue学习笔记（一）JS导入导出js文件-导出、批量导出、默认导出showMessage.jsexportfunctionsimpleMessage(msg){console.log(msg);}exportfunctioncomplexMessage(msg){console.log(newDate()+":"+msg);}//批量导出//export{simpleMessage,complex
  • Vue组件之间的样式冲突问题【Vue学习笔记12】 扶得一人醉如苏沐晨
    1.组件之间的样式冲突问题默认情况下，写在.vue组件中的样式会全局生效，因此很容易造成多个组件之间的样式冲突问题。导致组件之间样式冲突的根本原因是：（1）单页面应用程序中，所有组件的DOM结构，都是基于唯一的index.html页面进行呈现的；（2）每个组件中的样式，都会影响整个index.html页面中的DOM元素。1.1思考：如何解决组件样式冲突的问题为每个组件分配唯一的自定义属性，在编写组
  • Vue学习笔记13-- Vue3之计算属性与监视 jxncxgx Vue前端vue.js学习笔记
    7、计算属性与监视1.computed函数与Vue2.x中computed配置功能一致写法import{computed}from'vue'setup(){...//计算属性——简写letfullName=computed(()=>{returnperson.firstName+'-'+person.lastName})//计算属性——完整letfullName=computed({get(){r
  • 【Vue学习笔记_14】Vue CLI 2&3 脚手架 BugFrog1024 Vue前端javascriptvue前端
    【Vue学习笔记_14】VueCLI2&3脚手架VueCLI初识VueCLI2初始化项目ESLint规范Runtime-only和Runtime+Compiler的区别目录结构解析VueCLI3VueCLI3与VueCLI2的区别初始化项目目录结构解析VueCLI3配置文件的查看和修改配套可执行代码示例=>GitHubVueCLI初识需求：使用Vue开发大型项目时，我们需要考虑代码目录结构、项目结
  • JVM StackMapTable 属性的作用及理解 lijingyao8206 jvm字节码Class文件StackMapTable
            在Java 6版本之后JVM引入了栈图(Stack Map Table)概念。为了提高验证过程的效率，在字节码规范中添加了Stack Map Table属性，以下简称栈图，其方法的code属性中存储了局部变量和操作数的类型验证以及字节码的偏移量。也就是一个method需要且仅对应一个Stack Map Table。在Java 7版
  • 回调函数调用方法 百合不是茶 java
    最近在看大神写的代码时,.发现其中使用了很多的回调 ,以前只是在学习的时候经常用到 ,现在写个笔记 记录一下   代码很简单:           MainDemo  :调用方法  得到方法的返回结果        
  • [时间机器]制造时间机器需要一些材料 comsci 制造
          根据我的计算和推测,要完全实现制造一台时间机器,需要某些我们这个世界不存在的物质     和材料...       甚至可以这样说,这种材料和物质,我们在反应堆中也无法获得......      
  • 开口埋怨不如闭口做事 邓集海 邓集海 做人 做事 工作
    “开口埋怨，不如闭口做事。”不是名人名言，而是一个普通父亲对儿子的训导。但是，因为这句训导，这位普通父亲却造就了一个名人儿子。这位普通父亲造就的名人儿子，叫张明正。 　　 　　张明正出身贫寒，读书时成绩差，常挨老师批评。高中毕业，张明正连普通大学的分数线都没上。高考成绩出来后，平时开口怨这怨那的张明正，不从自身找原因，而是不停地埋怨自己家庭条件不好、埋怨父母没有给他创造良好的学习环境。 　　 　　
  • jQuery插件开发全解析，类级别与对象级别开发 IT独行者 jquery开发插件　函数
    jQuery插件的开发包括两种： 一种是类级别的插件开发，即给 jQuery添加新的全局函数，相当于给 jQuery类本身添加方法。 jQuery的全局函数就是属于 jQuery命名空间的函数，另一种是对象级别的插件开发，即给 jQuery对象添加方法。下面就两种函数的开发做详细的说明。   1 、类级别的插件开发 类级别的插件开发最直接的理解就是给jQuer
  • Rome解析Rss 413277409 Rome解析Rss
    import java.net.URL;  import java.util.List;    import org.junit.Test;    import com.sun.syndication.feed.synd.SyndCategory;  import com.sun.syndication.feed.synd.S
  • RSA加密解密 无量 加密解密rsa
    RSA加密解密代码 代码有待整理 package com.tongbanjie.commons.util; import java.security.Key; import java.security.KeyFactory; import java.security.KeyPair; import java.security.KeyPairGenerat
  • linux 软件安装遇到的问题 aichenglong linux遇到的问题ftp
    1 ftp配置中遇到的问题    500 OOPS: cannot change directory   出现该问题的原因:是SELinux安装机制的问题.只要disable SELinux就可以了   修改方法:1 修改/etc/selinux/config 中SELINUX=disabled    2 source /etc
  • 面试心得 alafqq 面试
    最近面试了好几家公司。记录下； 支付宝，面试我的人胖胖的，看着人挺好的；博彦外包的职位，面试失败； 阿里金融，面试官人也挺和善，只不过我让他吐血了。。。 由于印象比较深，记录下； 1，自我介绍 2，说下八种基本类型；（算上string。楼主才答了3种，哈哈，string其实不是基本类型，是引用类型） 3，什么是包装类，包装类的优点； 4，平时看过什么书？NND，什么书都没看过。。照样
  • java的多态性探讨 百合不是茶 java
    java的多态性是指main方法在调用属性的时候类可以对这一属性做出反应的情况 //package 1; class A{ public void test(){ System.out.println("A"); } } class D extends A{ public void test(){ S
  • 网络编程基础篇之JavaScript-学习笔记 bijian1013 JavaScript
    1.documentWrite <html> <head> <script language="JavaScript"> document.write("这是电脑网络学校"); document.close(); </script> </h
  • 探索JUnit4扩展：深入Rule bijian1013 JUnitRule单元测试
            本文将进一步探究Rule的应用，展示如何使用Rule来替代@BeforeClass，@AfterClass，@Before和@After的功能。         在上一篇中提到，可以使用Rule替代现有的大部分Runner扩展，而且也不提倡对Runner中的withBefores()，withAfte
  • [CSS]CSS浮动十五条规则 bit1129 css
    这些浮动规则，主要是参考CSS权威指南关于浮动规则的总结，然后添加一些简单的例子以验证和理解这些规则。   1. 所有的页面元素都可以浮动 2. 一个元素浮动后，会成为块级元素，比如<span>,a, strong等都会变成块级元素 3.一个元素左浮动，会向最近的块级父元素的左上角移动，直到浮动元素的左外边界碰到块级父元素的左内边界；如果这个块级父元素已经有浮动元素停靠了
  • 【Kafka六】Kafka Producer和Consumer多Broker、多Partition场景 bit1129 partition
    0.Kafka服务器配置 3个broker 1个topic，6个partition，副本因子是2 2个consumer，每个consumer三个线程并发读取   1. Producer package kafka.examples.multibrokers.producers; import java.util.Properties; import java.util.
  • zabbix_agentd.conf配置文件详解 ronin47 zabbix 配置文件
    Aliaskey的别名，例如 Alias=ttlsa.userid:vfs.file.regexp[/etc/passwd,^ttlsa:.:([0-9]+),,,,\1]， 或者ttlsa的用户ID。你可以使用key：vfs.file.regexp[/etc/passwd,^ttlsa:.: ([0-9]+),,,,\1]，也可以使用ttlsa.userid。备注: 别名不能重复，但是可以有多个
  • java--19.用矩阵求Fibonacci数列的第N项 bylijinnan fibonacci
    参考了网上的思路，写了个Java版的： public class Fibonacci { final static int[] A={1,1,1,0}; public static void main(String[] args) { int n=7; for(int i=0;i<=n;i++){ int f=fibonac
  • Netty源码学习-LengthFieldBasedFrameDecoder bylijinnan javanetty
    先看看LengthFieldBasedFrameDecoder的官方API http://docs.jboss.org/netty/3.1/api/org/jboss/netty/handler/codec/frame/LengthFieldBasedFrameDecoder.html API举例说明了LengthFieldBasedFrameDecoder的解析机制，如下： 实
  • AES加密解密 chicony 加密解密
    AES加解密算法，使用Base64做转码以及辅助加密： package com.wintv.common; import javax.crypto.Cipher; import javax.crypto.spec.IvParameterSpec; import javax.crypto.spec.SecretKeySpec; import sun.misc.BASE64Decod
  • 文件编码格式转换 ctrain 编码格式
    package com.test; import java.io.File; import java.io.FileInputStream; import java.io.FileOutputStream; import java.io.IOException; import java.io.InputStream; import java.io.OutputStream;
  • mysql 在linux客户端插入数据中文乱码 daizj mysql中文乱码
    1、查看系统客户端，数据库，连接层的编码  查看方法： http://daizj.iteye.com/blog/2174993 进入mysql，通过如下命令查看数据库编码方式： mysql>  show variables like 'character_set_%'; +--------------------------+------
  • 好代码是廉价的代码 dcj3sjt126com 程序员读书
      长久以来我一直主张：好代码是廉价的代码。 当我跟做开发的同事说出这话时，他们的第一反应是一种惊愕，然后是将近一个星期的嘲笑，把它当作一个笑话来讲。 当他们走近看我的表情、知道我是认真的时，才收敛一点。 当最初的惊愕消退后，他们会用一些这样的话来反驳： “好代码不廉价，好代码是采用经过数十年计算机科学研究和积累得出的最佳实践设计模式和方法论建立起来的精心制作的程序代码。” 我只
  • Android网络请求库——android-async-http dcj3sjt126com android
    在iOS开发中有大名鼎鼎的ASIHttpRequest库，用来处理网络请求操作，今天要介绍的是一个在Android上同样强大的网络请求库android-async-http，目前非常火的应用Instagram和Pinterest的Android版就是用的这个网络请求库。这个网络请求库是基于Apache HttpClient库之上的一个异步网络请求处理库，网络处理均基于Android的非UI线程，通
  • ORACLE 复习笔记之SQL语句的优化 eksliang SQL优化Oracle sql语句优化SQL语句的优化
    转载请出自出处：http://eksliang.iteye.com/blog/2097999   SQL语句的优化总结如下   sql语句的优化可以按照如下六个步骤进行： 合理使用索引 避免或者简化排序 消除对大表的扫描 避免复杂的通配符匹配 调整子查询的性能 EXISTS和IN运算符 下面我就按照上面这六个步骤分别进行总结：
  • 浅析：Android 嵌套滑动机制（NestedScrolling） gg163 android移动开发滑动机制嵌套
    谷歌在发布安卓 Lollipop版本之后，为了更好的用户体验，Google为Android的滑动机制提供了NestedScrolling特性 NestedScrolling的特性可以体现在哪里呢？<!--[if !supportLineBreakNewLine]--><!--[endif]--> 比如你使用了Toolbar，下面一个ScrollView，向上滚
  • 使用hovertree菜单作为后台导航 hvt JavaScriptjquery.nethovertreeasp.net
      hovertree是一个jquery菜单插件，官方网址：http://keleyi.com/jq/hovertree/ ，可以登录该网址体验效果。 0.1.3版本：http://keleyi.com/jq/hovertree/demo/demo.0.1.3.htm hovertree插件包含文件： http://keleyi.com/jq/hovertree/css
  • SVG 教程 （二）矩形 天梯梦 svg
    SVG <rect> SVG Shapes SVG有一些预定义的形状元素，可被开发者使用和操作： 矩形 <rect> 圆形 <circle> 椭圆 <ellipse> 线 <line> 折线 <polyline> 多边形 <polygon> 路径 <path>
  • 一个简单的队列 luyulong java数据结构队列
    public class MyQueue { private long[] arr; private int front; private int end; // 有效数据的大小 private int elements; public MyQueue() { arr = new long[10]; elements = 0; front
  • 基础数据结构和算法九：Binary Search Tree sunwinner Algorithm
      A binary search tree (BST) is a binary tree where each node has a Comparable key (and an associated value) and satisfies the restriction that the key in any node is larger than the keys in all
  • 项目出现的一些问题和体会 Steven-Walker DAOWebservlet
         第一篇博客不知道要写点什么，就先来点近阶段的感悟吧。     这几天学了servlet和数据库等知识，就参照老方的视频写了一个简单的增删改查的，完成了最简单的一些功能，使用了三层架构。 dao层完成的是对数据库具体的功能实现，service层调用了dao层的实现方法，具体对servlet提供支持。  &
  • 高手问答：Java老A带你全面提升Java单兵作战能力！ ITeye管理员 java
    本期特邀《Java特种兵》作者：谢宇，CSDN论坛ID: xieyuooo 针对JAVA问题给予大家解答，欢迎网友积极提问，与专家一起讨论! 作者简介： 淘宝网资深Java工程师，CSDN超人气博主，人称“胖哥”。 CSDN博客地址： http://blog.csdn.net/xieyuooo 作者在进入大学前是一个不折不扣的计算机白痴，曾经被人笑话过不懂鼠标是什么，
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他